vscode相关配置

setting.json配置

{
	// 配置服务
	"liveServer.settings.donotShowInfoMsg": true,
	"liveServer.settings.donotVerifyTags": true,
	"liveServer.settings.host": "172.16.89.220",

	// 左边工具栏窗口比例
	"window.zoomLevel": 1,

	// 配置主题
	"workbench.colorTheme": "deep_blue_see",

	// css查看定义
	"css.lint.duplicateProperties": "warning",

	// 自动保存
	"files.autoSave": "onFocusChange",

	// 关闭默认启动
	"grunt.autoDetect": "off",
	"gulp.autoDetect": "off",
	"php.suggest.basic": false,
	"php.validate.enable": false,
	"explorer.confirmDelete": false,
	"editor.mouseWheelZoom": true,
	"workbench.startupEditor": "newUntitledFile",
	"editor.suggest.snippetsPreventQuickSuggestions": false,


	// 补齐css兼容代码
	"autoprefixer.browsers": [
        "ie >= 7",  //ie7以上
        "firefox >= 8",
        "chrome >= 24",
    ],
    
	/**
	 * Sass编译配置
	 * nested:嵌套缩进的css代码
	 * expanded:没有缩进的、扩展的css代码
	 * compact:简洁格式的css代码
	 * compressed:压缩后的css代码
	 */
	"easysass.compileAfterSave": true,
	"easysass.formats": [
		{
			"format": "compact",
			"extension": ".css"
		}
	],
	"easysass.targetDir": "web/css/",


	// 使用beautify格式化
	"beautify.config": {
		"indent_size": 4,
		"brace_style": "none,preserve-inline",
		"wrap_line_length": 250
	},  
	
	// prettier格式化代码配置
	"prettier.tabWidth": 4, // 空格
	"prettier.singleQuote": true, // 使用单引号
	"prettier.semi": false, // 无需分号
	"prettier.printWidth": 100, // 指定代码换行的长度
	"prettier.useTabs": true, // 使用tab缩进
	"prettier.disableLanguages": ["vue"], // 忽悠.vue文件
	"prettier.quoteProps": "consistent", // 引号属性,尊重对象属性中引号的输入用法

	// 使用vetur格式化.vue文件
	"vetur.format.options.tabSize": 4,
	"vetur.format.defaultFormatterOptions": {
		"prettier": {
			"printWidth": 100,
			"semi": false,
			"singleQuote": true
		}
	}

插件

Auto Rename Tag // 自动修改标签
Bracket Pair Colorizer  // 为代码中的括号们添上一抹亮色
Chinese (Simplified) Language Pack for Visual Studio Code // 中文文档
CSS Peek // 查看css定义
deep_blue_see Theme // 主题
Easy Sass // 编译sass
HTML CSS Support  css // 提示
Image preview  // 行数显示有图片的标签
JavaScript (ES6) code snippets // es6提示
jQuery Code Snippets // jquery提示
Live Server  // 开启http
open in browser  // 打开浏览器
Path Intellisense  // 快速定位相关路径
Beautify // 格式化代码
Prettier - Code formatter  // 格式化代码
Vetur // vue代码格式化
autoprefixer 补齐css兼容性代码


版权声明:本文为u012500054原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。