vite内置了eslint和prettier的模板,所以不用像以前那样从头配置Eslint和Prettier 项目创建步骤如下: 一、vite 创建项目 npm init vite@latest 项目名字 框架选vue 选customize with create-vue,然后根据项目选择(选择customize with create-vue实际就是去调了npm init vue@latest) 二、项目创建完成后的目录结构 已经...
创建一个新的Vue项目 vuecreatemy-project 安装TypeScript npm install--save-devtypescript 配置TypeScript 在项目根目录下创建一个tsconfig.json文件,并添加以下内容: {"compilerOptions":{"target":"esnext","module":"esnext","strict":true,"jsx":"preserve","moduleResolution":"node","esModuleInterop":...
在Vue3 + Vite + TypeScript 项目中配置 ESLint 的步骤 在Vue3 + Vite + TypeScript 项目中配置 ESLint 可以帮助你保持代码风格的一致性,并自动检测代码中的潜在问题。以下是详细的配置步骤: 初始化项目 如果你还没有创建 Vue3 + Vite + TypeScript 项目,可以使用以下命令初始化: bash npm init vite@lates...
1. 安装 8.X 版本的 eslint pnpm i eslint@^8.57.0 -D 2. 安装 eslint 以及 prettier 以及一堆依赖 pnpm i eslint eslint-plugin-vue @vue/eslint-config-prettier prettier eslint-plugin-prettier eslint-config-prettier eslint-plugin-import -D 3. 安装 TS 依赖 pnpm i @typescript-eslint/pars...
1.3.3、找不到模块“./App.vue”或其相应的类型声明。ts(2307) 解决方法:在vite-env.d.ts文件中增加以下声明: declare module '*.vue'{ import type { DefineComponent } from'vue'; const vueComponent: DefineComponent<{}, {}, any>; exportdefaultvueComponent; ...
此项目可用于学习Vite + typescript + vue3生态链的相关技术 包含内容 Vite + typescript + vue3生态链 项目架构 Vite 分开发环境和生产环境进行配置 新旧浏览器的兼容性处理 配置eslint + stylelint + prettier 去统一代码风格 配置commitizen + commitlint 去规范代码提交,提交代码时不要执行git commit ,而是执...
3. 引入 eslint 安装eslint prettier 依赖 @typescript-eslint/parser @typescr ipt-eslint/eslint-plugin 为eslint 对 typescript 支持。 yarn add --dev eslint prettier eslint-config-prettier eslint-plugin-prettier eslint-plugin-vue @typescript-eslint/parser @typescr ipt-eslint/eslint-plugin 在...
Vite 基于缓存的热更新,Vue-CLI 基于 Webpack 的热更新 1.2、使用vite构建第一个vue项目 方法一: 要使用 Vite 来创建一个 Vue 项目,非常简单: 代码语言:javascript 复制 $ npm init vue@latest 这个命令会安装和执行create-vue,它是 Vue 提供的官方脚手架工具。跟随命令行的提示继续操作即可。
1.3 配置.eslintrc.js 此时在项目中会产生一个.eslintrc.js文件,因为eslint默认是不会解析.vue后缀文件的,所以还需要额外的解析器,但初始的.eslintrc.js文件中extends配置顺序原因@typescript-eslint/parser把vue-eslint-parser覆盖了。所以这里需要做些修改,配置如下: ...
"typescript": "^5.2.2", "vite": "^5.0.8", "vue-tsc": "^1.8.25" } } 四、安装element plus 安装指令:npm install element-plus --save 自动按需导入指令:npm install -D unplugin-vue-components unplugin-auto-import 在项目配置文件中配置如下代码: ...