美文网首页我爱编程
VSCode开发Vue项目配置

VSCode开发Vue项目配置

作者: 卡牌不会飞 | 来源:发表于2018-03-02 09:32 被阅读0次

1、去微软官网下载Vscode编辑器

地址:https://code.visualstudio.com/

2、安装必要插件(如下图)

3、更改配置文件

代码复制:

```

{

  "editor.suggestSelection": "first",

  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",

  "workbench.colorTheme": "Atom One Dark",

  "css.completion.completePropertyWithSemicolon": true,

  "scss.completion.completePropertyWithSemicolon": false,

  "editor.acceptSuggestionOnCommitCharacter": false,

  "vetur.format.defaultFormatterOptions": {

    "prettier": {

      "semi": false,

      "singleQuote": true,

    }

  },

  "stylusSupremacy.insertColons": false, // 是否插入冒号

  "stylusSupremacy.insertSemicolons": false, // 是否插入分好

  "stylusSupremacy.insertBraces": false, // 是否插入大括号

  "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行

  "stylusSupremacy.insertNewLineAroundBlocks": false // 两个选择器中是否换行

}

```

4、创建项目

第一步:安装vue-cli

cnpm install vue-cli -g      //全局安装 vue-cli  (已安装跳过)

第二步:cd目录路径,新建vue项目

vue init webpack  ”项目名称“

第三步:安装插件

1、前端UI插件:  

 npm i element-ui -S 

https://element.eleme.cn/#/zh-CN/component/installation

2、CSS预处理器(stylus):

npm install stylus--save    

npm install stylus-loader --save

3、图表插件(echart)

npm install echart --save

https://www.echartsjs.com/zh/index.html

相关文章

网友评论

    本文标题:VSCode开发Vue项目配置

    本文链接:https://www.haomeiwen.com/subject/tsvoxftx.html