首页 > 其他分享 >VSCode插件 : ESLint Prettier Vite

VSCode插件 : ESLint Prettier Vite

时间:2023-04-08 13:11:30浏览次数:39  
标签:插件 prettier VSCode eslint pnpm vite ESLint

# 创建项目
pnpm create vite vite-eslint --template vue
  cd vite-eslint
  pnpm install
  pnpm run dev

# 安装插件
pnpm i prettier -D

# 创建配置文件
echo {}> .prettierrc.json

# 安装ESLint
pnpm i eslint eslint-plugin-vue -D
# 安装 eslint-config-prettier
pnpm i eslint-config-prettier -D

cat > .eslintrc.js <<EOF
module.exports = {
  env: {
    node: true,
  },
  extends: [
    'eslint:recommended',
    'plugin:vue/vue3-recommended',
    "prettier"
  ],
  rules: {
    // override/add rules settings here, such as:
    // 'vue/no-unused-vars': 'error'
    //...
    "vue/require-default-prop": "off",
  }
}
EOF

// package.json
"scripts":{
  //...
    "lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src",
    "format": "prettier .  --write"
}


// Code/User/settings.json
{
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "vetur.validation.template": false,
  "[vue]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
}

标签:插件,prettier,VSCode,eslint,pnpm,vite,ESLint
From: https://www.cnblogs.com/leoshi/p/17298344.html

相关文章

  • Dart+VSCODE 安装
    DartforWindows(gekorm.com)  下载后执行安装器  安装后重启动计算机run--dart--version看到如下信息表示DART安装成功  VSCODE插件安装1、DART2CODERUNNER     HELLOWORLD  ......
  • VsCode中出现红色波浪线
    很奇怪的一天中,VsCode中突然出现了很多红色波浪线,然后上网查了查,发现是Pylance的问题,那就想办法解决了,比如下面的问题:要做的呢?就是打开VsCode中的设置:然后就是打开settings.json文件,如下图:打开之后,就可以借鉴这篇博文的内容了,https://blog.csdn.net/CassieZh/articl......
  • Tomcat的Maven插件
    <build><plugins><plugin><!--tomcat插件--><groupId>ch.apache.tomcat.maven</groupId><artifactId>tomcat7-maven-plugin</art......
  • 《渗透测试》安全开发-PHP应用&留言板功能&超全局变量&数据库操作&第三方插件引用 202
    PHPStorm:专业PHP开发IDEPhpStudy:ApacheMYSQL环境NavicatPremium:全能数据库管理工具 #数据导入-mysql架构&库表列1、数据库名,数据库表名,数据库列名2、数据库数据,格式类型,长度,键等 #数据库操作-mysqli函数&增删改查PHP函数:连接,选择,执行,结果,关闭等参考:https://......
  • VScode美化
    RESULT:EVA-初号机配色主题效果1.需要的东西vscodebackground插件customCSSandJSloader插件一些png素材,推荐网址:https://www.vhv.rs/https://anime-pictures.net/EVAUnit-1ThemeV2主题插件2.安装步骤安装vscode安装插件和主题下载好相应的png......
  • Blender机械建模插件MESHmachine:Plug库
    推荐:将NSDT场景编辑器加入你的3D工具链Plug库MESHmachine支持第三方插件库。哪些文件夹充满了插入混合文件和图标。查看插件首选项以获取有关如何添加库的详细信息。以下插件库不是MESHmachine本身的一部分,而是由其各自的作者创建的。抽象景观Vol.1多功能Plug网孔机Plug固体Plu......
  • MySQL新身份验证插件caching_sha2_password
     用sequelpro工具登录,连接失败~!“Authenticationplugin'caching_sha2_password'cannotbeloaded”失败原因:mysql8之前的版本中加密规则是mysql_native_password,而在mysql8之后,加密规则是caching_sha2_password解决办法:把mysql用户登录密码加密规则还原成mysql_nati......
  • C# asp.net开源插件推荐:PdfiumViewer ( pdf 转成 图片png pdf convert to image )
    1.nuget安装插件2.上代码//DefinemethodtoconvertPDFtoPNGpublicvoidConvertPdfToPng(stringpdfFilePath,stringpngFileFolder,ImageFormatformat){//Setresolution(DPI)intdpi=300;//Ren......
  • 堪比Topogun的神级拓扑插件RetopoFlow
    推荐:将 NSDT场景编辑器 加入你的3D开发工具链以往我们需要拓扑时一般都是借助到Topogun这个软件,今天来介绍下Blender中一个神级拓扑插件RetopoFlow,如果使用Blender工作流的小伙伴可以尝试使用下,至少不用导来导去那么麻烦了~1、使用教程Blender的插件安装基本都一样,这里就不多......
  • docker dev Environment+node16+vscode联合开发
    笔记软件在2023/4/713:33:47推送该笔记1.DockerFileFROMcentos:7.6.1810RUNmkdir-p/data/nodeWORKDIR/data/node#RUNcurlhttps://nodejs.org/dist/v16.20.0/node-v16.20.0-linux-x64.tar.gz>node-v16.20.0-linux-x64.tar.gzCOPY/env/node-v16.20.0-linux-x64.......