Vue或React结合JavaScript Standard Style，格式化代码

最新推荐文章于 2024-03-28 11:23:58 发布
最新推荐文章于 2024-03-28 11:23:58 发布
阅读量1k 收藏
点赞数 1
分类专栏： Vue React 文章标签： VS Code
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Loya0813/article/details/88687589
版权
本文介绍了如何在VS Code中为Vue和React项目配置代码格式化，包括使用Prettier、Vetur、StandardJS等插件，并详细说明了在settings.json和package.json中的配置步骤。
摘要由CSDN通过智能技术生成

一、Vue，格式化配置

1. 依赖文档格式化插件，Prettier - Code formatter，Vetur，StandardJS - JavaScript Standard Style

 

 

2. 设置settings.json（文件 --> 首选项 --> 设置 --> 工作区设置）

// settings.json

{
  "editor.tabSize": 2,
  "prettier.semi": false,
  "prettier.singleQuote": true,
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  "typescript.format.insertSpaceBeforeFunctionParenthesis": true,
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatter.js": "
最低0.47元/天 解锁文章
海贼8023
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
详解如何在vue项目中使用eslint+prettier格式化代码
10-17
本文将详细讲解如何在Vue项目中集成`eslint`和`prettier`，以实现代码的自动格式化和规范检查。 `eslint`是一款强大的静态代码分析工具，它可以检查代码中的错误、潜在问题，并且支持自定义规则来符合特定的编码...
Vue项目：style样式篇
最新发布
m0_63174811的博客
04-12 2346
面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。为了帮助大家更好更高效的准备面试，特别整理了《前端工程师面试手册》电子稿文件。前端面试题汇总JavaScript性能linux前端资料汇总。
vue2、vue3代码格式化
weixin_45849354的博客
02-08 2545
vue2,vue3格式化工具
vsCode实现eslint,Prettier格式化（react框架,.umi.js架构）
qq_38359639的博客
03-28 906
在应用商店下载Prettier插件 npm i @umijs/lint -D 设置vscode配置文件settings.json { "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" } } 配置.eslintrc.js规则文件，复制下面内容 module.exports = { 'env': { browser: true, es2021: true, nod
React的代码格式化插件jsfmt
SARS_的博客
02-24 1424
安装jsfmt 光安装jsfmt是不行的，还需要esformatter 和esformatter -jsx这两个插件 安装esformatter 和 esformatter-jsx npm i esformatter@latest esformatter-jsx@latest 修改配置文件 修改jsfmt的setting-user { “extensions”: [ “js”, “jsx”, “...
atom format js_使用的atom的atom-beautify插件格式化js代码出错
weixin_30120123的博客
12-23 241
问题描述刚开始学react.js，在使用的atom的atom-beautify插件格式化js代码时，非但没有把代码对齐，反而变得更奇怪了。相关代码格式化之前的代码return (< header >< Row > < /Col> ReactNews 头条 社会国内国际{userShow} this.setModalVisible(false)} o...
Vue-cli Eslint在vscode里代码自动格式化的方法
08-27
Vue CLI 默认已经包含了 Eslint 配置，它遵循的是 JavaScript Standard Style，一种严格的代码风格指南。如果想要在保存文件时自动修复代码错误和格式问题，可以启用 Eslint 的 `autoFixOnSave` 功能。首先，确保...
vscode配置vue下的es6规范自动格式化详解
10-17
现在，当你在Vue项目中编写或保存ES6代码时，VSCode将自动应用ESLint的规则进行格式化，确保代码符合ES6规范。 需要注意的是，为了使ESLint正确工作，你需要在项目根目录下配置`.eslintrc.js`或`.eslintrc.yaml`...
atom-standardjs-snippets：Atom，标准样式JavaScript代码段的集合
01-30
《Atom中的标准样式JavaScript代码段集合：atom-standardjs-snippets》 在编程世界里，高效编码是提升开发速度的关键。Atom是一款广受欢迎的开源文本编辑器，它支持大量的插件和扩展，使得开发者可以根据个人需求...
深入浅出 React 18 中的严格模式
p1967914901的博客
10-17 1628
在本文中，你将了解严格模式以及引入它的初衷。你将了解它的各种特性，以及 v18 版本如何改进其 API 并提供与 hook 更好的兼容性。
eslint-config-prettier-standard:使用'Prettier'和'JavaScript Standard Style'作为ESLint规则的项目的ESLint可共享配置
05-09
eslint-config-prettier-standard 一个ESLint，使用更漂亮和JavaScript标准样式为ESLint规则项目。 安装 这些说明假定您已经安装了ESLint（ npm install --save-dev eslint ）。 两线安装 npm install --save-dev eslint-config-prettier eslint-config-prettier-standard eslint-config-standard eslint-plugin-import eslint-plugin-node eslint-plugin-prettier eslint-plugin-promise prettier-config-standard npm install --save-dev --save-exact prettier 逐行安装 安装对
react-standardreactJavaScript标准风格指南
08-14
standard-react - JavaScript标准风格指南
前端setting.json配置
qq_45585640的博客
02-13 998
前端setting.json配置
vscode Vue项目 ESlint 风格格式化配置
Qanx的博客
03-03 1708
vscode Vue项目 ESlint 风格格式化配置
vue--02 Prettier格式化
qq_25672165的博客
03-27 1762
vue+eslint+prettierrc使用
vue style样式设置方式
热门推荐
凌霄的博客
10-22 1万+
<style> .red { color: red; } .thin { font-weight: 200; } .italic { font-style: italic; } .active { letter-spacing: 0.5em; } </styl...
vue怎么格式化文档_ESlint + stylelint + VSCode自动格式化代码(2020)
weixin_29543211的博客
01-31 2040
eslint 格式化 js 代码本文用 Vue 项目做示范。利用 Vue CLI 创建项目时要将 ESlint 选上，下载完依赖后，用 VSCode 打开项目。安装插件 ESLint，然后File->Preference->Settings(如果装了中文插件包应该是 文件 -> 选项 -> 设置)，搜索 eslint，点击 Edit in setting....
Vue项目代码-最流行的格式化方法(2022年最新版)
wenjin_Deng的博客
11-28 2322
Vue项目代码流行的格式化设置
vscode配合eslint自动修复格式化(vue3或react)
06-28
要使用VSCode配合ESLint自动修复格式化Vue3或React代码，需要按照以下步骤操作： 1. 在VSCode中安装ESLint插件和Prettier插件。 2. 在项目根目录下安装ESLint和Prettier依赖包。 3. 在项目根目录下创建.eslintrc....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值