学习目标：做到代码格式等统一，此时，esint和prettier就要登场了。学习内容：eslint是代码检测工具，可以检测出你代码中潜在的问题，比如使用了某个变量却忘记了定义。prettier是代码格式化工具，作为代码格式化工具，能够统一你或者你的团队的代码风格。=>安装prettier+eslint包，并做一系列的配置学习时间：创建项目yarncreatevite选择vue作为framework选择vue-ts是package.json中配置的eslint和prettier相关的包：{"name":"xxx","private":true,"version":"0.0.0","type":"
前言本文基于“vite”:“^5.0.0”1.安装依赖安装eslintyarnaddeslint--dev安装eslint-plugin-vueyarnaddeslint-plugin-vue--dev主要用于检查Vue文件语法安装prettier及相关插件yarnaddprettiereslint-config-prettiereslint-plugin-prettier--dev安装typescript解析器、规则补充yarnadd@typescript-eslint/parser@typescript-eslint/eslint-plugin--dev2.根目录创建.eslintrc.c
文章目录1，介绍2，Prettier插件安装3，全局配置（settings.json）4，局部配置（新建.prettierrc文件）5，Prettier格式化优先级（重要）6，使用prettier格式化无效的解决办法7，.editorconfig文件使用介绍1，介绍官方解释：Prettier是一个固执己见的代码格式化程序。它通过解析代码并使用自己的规则重新打印代码来强制实现一致的风格，这些规则考虑了最大行长度，并在必要时包装代码。其实就是一个代码格式化工具，是你写的代码更加合理和优美，同时这个插件配置也是非常的简单；2，Prettier插件安装到vsCode的扩展商城安装，如下第一个就是：3，
一.npm引入//eslint"eslint":"^8.35.0","eslint-config-prettier":"^8.6.0","eslint-plugin-prettier":"^4.2.1","eslint-plugin-vue":"^9.9.0","@typescript-eslint/eslint-plugin":"^5.54.0","@typescript-eslint/parser":"^5.54.0","@typescript-eslint/typescript-estree":"^6.9.0","vite-plugin-eslint":"^1.8.1","vue-esl
一.ESLint作用 检查Javascript编程时的语法错误。新建或修改文件时报错原因 Windows系统，clone的代码会自动把换行符LF转为回车符CRLF，这时本地的代码都是回车符。可在prettier.config.js中查看到检查配置（ESLint中是否支持JavaScript/vue语言）（1）在VScode中，使用Ctr+打开设置画面（或File-Preferences-Settings）（2）点击“Editinsettings.json”（编辑设置的json文件）（3）配置代码{"[javascript]":{"editor.defaultFormatter":"
一、esLintesLint是提供一个插件化的javascript代码检测工具。esLint配置文件遵循commonJS的导出规则，所导出的对象是eslint的配置对象。module.exports={//表示当前目录即为根目录，eslint规则将被限制到该目录下root:true,//env表示启用eslint检测的环境env:{//在node环境下启动eslint检测node:true},//eslint中基础配置需要继承的配置extends:['plugin:vue/essential','@vue/standard'],//解析器parserOptions:{parser:'babel
Vue3+ESLint+Prettier配置规则1初始化项目新建vue-cli项目。如果已有项目，可直接跳到最后一步。①在cmd中输入如下代码，开始创建项目。提示：如果没有安装vue-cli，执行npminstall-g@vue/cli安装即可。vuecreate"项目名称"②选择Manuallyselectfeatures（手动选择功能）。③根据自己需求选择，这里只选择了Linter/Formatter。④选择版本。⑤选择ESLint+Prettier。⑥选择Lintonsave。⑦选择Indedicatedconfigfiles。⑧是否将此次配置保存为未来项目的预设。⑨如果项目中未安装ES
关于代码格式的讨论数不胜数，个人认为没有绝对的对与错，代码只要始终遵守可读性，可拓展性强这两点我认为就是优秀的代码。如果是个人项目那就没有什么问题，但是如果涉及到多人开发，就不可避免的遇到代码风格迥异，从而给组内其他成员增加阅读代码时的心智负担，所以需要指定编码格式，团队中的每个人都严格执行，且使用工具对代码进行检查，规范提交。1.首先先创建一个示例vue3空项目我这里使用pnpm，注：pnpm最低支持node版本为16，所以使用前请先nvm切换至16版本及其以上。（如果没有安装请先npmi-gpnpm，mac电脑如果提示没有权限，即sudonpmi-gpnpm）pnpmcreatevitet
准备工作使用vscode新建一个项目（比如叫my-project）初始化git仓库（gitinit)初始化package.json(npminit-y)新建src/main.js项目结构如图.git目录没有出现在vscode编辑器中是正常的。1.husky在介绍husky之前，首先要理解什么是hook（钩子），在前端Vue框架中提供了beforCreated、created、beforeMounted、mounted等函数、这些函数都是钩子，也常被称为‘生命周期钩子函数’，它们会在Vue实例化过程中有序地执行。在Git中也存在一些钩子，其中较常用的有pre-push、pre-commit，其中
一、插件的介绍与安装1、Vetur插件Vetur是一款Vue代码高亮显示的一款插件，在没有使用此插件前，以.vue的文件名代码是没有颜色的！！！安装步骤：在扩展商店中搜索（Vetur）点击安装2、ESLint插件 ESLint插件主要用来检测代码的语法格式，以便我们规范书写，避免因编译所发生的错误。安装步骤：在扩展商店中搜索（ESLint）点击安装3、Prettier-Codeformatter插件该插件主要用于格式化代码在在扩展商店中搜索（Prettier-Codeformatter）点击安装二、相关文件配置1、在安装完以上插件后，进入VsCode设置面板 2、点击按钮打开json文件3、
