(一)vue开发环境vscode的搭建


1:安装vscode

安装vscode (下载地址:https://code.visualstudio.com/Download)

2:在vscode的拓展里面安装对应需要的插件

Ant Design Vue helper、ESLint、JavaScript (ES6) code snippets、Prettier - Code formatter、Vetur、Vue VSCode Snippets、Vue.js AutoImport , Chinese (Simplified) 

3:安装node.js在在cmd里面npm install yarn -g安装yarn (NodeJs下载地址: https://nodejs.org/en/ )

4:node -v yarn -v查看是否安装成功

5:文件-首选项-设置-settings.json 复制代码

{
"extensions.ignoreRecommendations": false,
"team.showWelcomeMessage": false,
"git.enableSmartCommit": true,
"vsicons.dontShowNewVersionMessage": true,
"git.autofetch": true,
"react.beautify.onSave": true,
"files.associations": {
"*.js": "javascriptreact"
},
"git.confirmSync": false,
"explorer.confirmDelete": false,
"[markdown]": {},
"eslint.enable": true,
"eslint.options": {
"extensions": [
".js",
".jsx",
".vue"
]
},
"vetur.validation.template": false,
"editor.tabSize": 2,
"jest.autoEnable": false,
"jest.pathToConfig": "./.jest.js",
"terminal.integrated.rendererType": "dom",
"window.zoomLevel": 0,
"editor.fontSize": 18,
"editor.quickSuggestions": {
"strings": true
},
"diffEditor.renderSideBySide": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"[javascriptreact]": {
"editor.defaultFormatter": "octref.vetur"
},
"workbench.editor.enablePreview": false,
"editor.fontLigatures": true,
"editor.fontFamily": "Fira Code",
"terminal.integrated.fontFamily": "monospace",
"terminal.integrated.tabs.enabled": true,
"workbench.editorAssociations": [

],
}

6:Control+s保存,关闭

7:Shift + Alt + F  格式化代码

8:电脑右下角得eslist,prettier设置为允许

vue