vscode开发vue首选项配置及常用插件扩展
vsCode首选项配置1.进入vscode页面,点击设置打开开用户设置或者点击文件》首选项进入该页面2.如果进入为上述页面,找不到setting.json文件,可通过ctrl+shift+p快捷键,在搜索栏输入preferences:open settings(json)3.进入用户模式进行配置,初始化用户设置为空,将下面内容拷贝进去(注意大括号{}),红色的区域主要是为了css提示设置...
vsCode首选项配置
1.进入vscode页面,点击设置打开开用户设置或者点击文件》首选项进入该页面
2.如果进入为上述页面,找不到setting.json文件,可通过ctrl+shift+p快捷键,在搜索栏输入preferences:open settings(json)
3.进入用户模式进行配置,初始化用户设置为空,将下面内容拷贝进去(注意大括号{}),红色的区域主要是为了css提示设置(vscode安装HTML CSS Support)
{
"workbench.iconTheme": "vscode-icons",
"editor.fontSize": 16,
"editor.renderIndentGuides": false,
"files.autoSave": "afterDelay", <font color='red'>
"editor.parameterHints": true,
"editor.quickSuggestions": {
"other": true,
"comments": true,
"strings": true
},
</font>
"liveSassCompile.settings.formats":[
{
"format": "expanded",
"extensionName": ".css",
"savePath": "/css"
},
{
"extensionName": ".min.css",
"format": "compressed",
"savePath": "/css"
}
],
"liveSassCompile.settings.excludeList": [
"**/node_modules/**",
".vscode/**"
],
"liveSassCompile.settings.generateMap": true,
"easysass.formats": [
{
"format": "expanded",
"extension": ".css"
},
{
"format": "compressed",
"extension": ".min.css"
}
],
"easysass.targetDir": "./css/",
"background.customImages": [
"file:///D://222.png"
],
"background.useDefault": false,
"background.style": {
"content": "''",
"pointer-events": "none",
"position": "absolute",
"z-index": "99999",
"width": "102%",
"height": "100%",
"background-position": "0%",
"background-repeat": "no-repeat",
"opacity": 0.3
},
"cssrem.rootFontSize": 1,
"cssrem.autoRemovePrefixZero": false,
"cssrem.fixedDigits": 3,
"beautify.language": {
"js": {
"type": [
"javascript",
"json"
],
"filename": [
".jshintrc",
".jsbeautify"
]
},
"css": [
"css",
"scss"
],
"html": [
"htm",
"vue",
"html"
]
}
}
4.vue环境搭建好后,用vscode安装日常用的插件(非常方便),只需点击扩展,在搜索框中搜索你所需要的插件即可
常用的插件主要有以下:
chinese 中文简体安装包
Vetur 语法高亮、智能感知
Vscode-icons 目录树图标
Auto Close 自动添加HTML / XML关闭标签
Beautify 格式化javascript,JSON,CSS,Sass,和HTM
css Peek 可以查看CSS ID和Class类与HTML文件中相应的CSS定义相对应
Html Css Support Html标签智能提示
Html Snippets Html代码片段
javaScript Es6 支持ES6语法
jQuery code 支持jQuery
One Dark Pro 代码主题颜色(有好多可以自己去查)
Path Autocomplelet 引入文件路径提示
更多推荐
所有评论(0)