(一)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设置为允许

 

 

注意

（1）：一定不要再windows7下面使用npm,windows7可能找得到能安装nodes的版本,但是后面一旦安装一些插件的时候就会出现一大堆的不兼容,

所以系统一定要升级到window10，或者10以上

升级windows10的步骤

1：https://windows.xnflq.cn/   进入那个网站=》点击win10系统=》点击win10 64位=》迅雷下载（急速）把win10下载下来

2：按照 https://windows.xnflq.cn/course.html 呢里面的说明

解压后直接点击(硬盘安装.exe)=>点击立即重装=》然后温馨提示框直接点击确定

然后完成后会重启会自动安装完整个流程(后面的步骤都是装机软件自动再安装了)，安装完即可

如果出现输入字母键盘打出来的是数字，直接按FN+INSERT NUM LK键盘,关闭数字键盘

（2）：

 ERROR  TypeError: Cannot read property 'version' of undefined

解决方法

后面重新使用npm install eslint 安装eslint ，然后重新安装依赖npm install ,在次使用yarn run serve

 （3）：

yarn : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\yarn.ps1，因为在此系统上禁止运
行脚本。有关详细信息，请参阅 http://go.microsoft.com/fwlink/?LinkID=135170 中的 about_Executio
n_Policies。

解决方法:

1、搜索powershell，右键以管理员身份运行

2执行：set-ExecutionPolicy RemoteSigned

3、查看执行策略：get-ExecutionPolicy