vue：概要

 

1、環境

 

#安裝nodejs-官網安裝包配置環境變量
node -v

#安裝webpack
npm install webpack -g

#安裝vue-cli
npm install vue-cli -g

#新建項目
vue init webpack vuedemo

#運行項目
npm run dev

 

npm install報錯的

npm cache clean --force

 

 

2、生命週期

 

 

三、部署

 

npm run build

生成的dist內容直接以靜態文件方式部署到服務器就OK；

build參數根據project.json的配置節點scripts肯定；好比：npm run build:prod

 經過webpack.DefinePlugin切換環境

new webpack.DefinePlugin({
  'process.env': require('../config/xxx.env')
})

 

分析：

npm run build:prod --report

 https://zhuanlan.zhihu.com/p/26710831

 https://panjiachen.github.io/vue-element-admin-site/zh/guide/essentials/deploy.html#%E6%9E%84%E5%BB%BA

資源:

npm經常使用命令

http://www.javashuo.com/article/p-mcqbiybf-bx.html

 經常使用插件

https://github.com/varHarrie/varharrie.github.io/issues/10

工具配置

{
  "breadcrumbs.enabled": true,
  "editor.tabSize": 2,
  "editor.renderWhitespace": "boundary",
  "editor.cursorBlinking": "smooth",
  "editor.minimap.renderCharacters": false,
  "editor.fontFamily": "'Fira Code', 'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",
  "editor.fontLigatures": true,
  "explorer.confirmDragAndDrop": false,
  "extensions.autoUpdate": false,
  "files.insertFinalNewline": true,
  "git.autofetch": true,
  "git.path": "F:\\Program Files\\Git\\cmd\\git.exe",
  "search.exclude": {
    "**/node_modules": true,
    "**/dist": true
  },
  "typescript.locale": "en",
  "window.titleBarStyle": "custom",
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
  "window.zoomLevel": 1,
  "workbench.activityBar.visible": true,
  "workbench.colorTheme": "Plastic - deprioritised punctuation",
  "workbench.iconTheme": "vscode-great-icons",
  "workbench.startupEditor": "newUntitledFile",
  "eslint.autoFixOnSave": true,
  "eslint.validate": ["javascript", "javascriptreact", "vue"],
  "vsicons.projectDetection.autoReload": true,
  "vsicons.dontShowNewVersionMessage": true,
  "tslint.autoFixOnSave": true,
  "debugwrapper.wrappers": {
    "default": "console.log('$eSEL', $SEL)"
  },
  "prettier.tslintIntegration": true,
  "cSpell.userWords": [
    "Unmount"
  ],
  "jest.autoEnable": false,
}

VSCode