位置: IT常识 - 正文
VSCode中Prettier插件&依赖安装及冲突解决(vscode插件vuter)
发布时间：2024-01-14VSCode中Prettier插件&依赖安装及冲突解决 文章目录一、Prettier插件安装1.1 安装Prettier插件1.2 添加Prettier配置文件1.3 配置格式化工具1.4 配置自动格式化1.5 与ESLint冲突解决二、Prettier依赖安装2.1 安装依赖2.2 配置2.3 配置指令2.4 其他配置和冲突解决一、Prettier插件安装1.1 安装Prettier插件
本文链接地址:https://www.jiuchutong.com/zhishi/295317.html
转载请保留说明！
推荐整理分享VSCode中Prettier插件&依赖安装及冲突解决(vscode插件vuter)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vscode插件vuter,vscode插件emmet,vscode插件vuter,vscode preview插件,vscode prelaunch,vscode插件vuter,vscode pritter,vscode pritter,内容如对您有帮助，希望把文章链接给更多的朋友！
通过VSCode安装插件，如图：
1.2 添加Prettier配置文件在项目根目录，添加Prettier配置文件.prettierrc，编写配置如下：
{ "useTabs": false, "tabWidth": 2, "printWidth": 80, "singleQuote": true, "trailingComma": "none", "semi": false}1.3 配置格式化工具在任意页面右键，选择格式化工具，如图： 将Prettier配置为格式化默认工具即可
1.4 配置自动格式化选择设置，如图： 勾选在保存时格式化文件，如下： 这样，每次在保存文件时，就会自动完成格式化。
1.5 与ESLint冲突解决Prettier与ESLint在函数定义那块(空格)会有一个小冲突，可以通过配置解决一下即可。在.eslintrc.js中的rules中添加自定义规则，如下:
rules: { ... 'space-before-function-paren': 'off' ...}二、Prettier依赖安装2.1 安装依赖除了使用VSCode插件外，还可以使用依赖安装，执行命令如下：
npm install prettier -D2.2 配置除1.2中.prettierrc文件配置外，还需要配置.prettierignore，用来忽略哪些文件或目录，如下：
/dist/*.local.output.js/node_modules/****/*.svg**/*.sh/public/*2.3 配置指令在package.json中配置prettier指令，如下：
"scripts": { ... "prettier": "prettier --write .", ...},这样配置完成后，就可以通过
npm run prettier对整个项目文件进行格式化操作
2.4 其他配置和冲突解决其他保存自动格式化等配置同插件安装一致，不再赘述。
上一篇：Vue开发实例（11）之el-menu实现左侧菜单导航(vue实战开发项目视频)
下一篇：黏菌算法（Slime Mould Algorithm，SMA）(黏菌算法总结)
