|
vue3.0 + vite + typescript + eslint + prettier + vscode
对vue3.0进行常规模板设计包含目录结构/ router布局/ vuex(包含modules)/ eslint与typescript配置等,开箱即用
- https://www.npmjs.com/package/vite 全局安装
vite 并创建 vue3.0 项目 - VScode 编辑器安装插件:
prettier 与 eslint 且依赖包 npm add --save-dev prettierrc typescript prettierrc eslint-config-prettier eslint-plugin-prettier - 配置
prettier、 eslint 与 typescript: prettier 手动创建 .prettierrc; eslint 命令行创建 .node_modules.bineslint --init (重点配置框架、导入模式、启用 typescript); typescript 命令行创建 .node_modules.bintsc --init(如果没该文件会使用 eslint 内置配置); - editorConfig 配置编辑器中展示格式
src/shims-vue.d.ts 声明支持 vue 文件并在 index.html 中直接引入 main.ts(Vite DEV 环境默认支持直接引入 TS 文件)- vue-router4.0 使用与 3.0 版本几乎一致使用方式,仅仅引用方式有所改变,可参考模板
- vuex4.0
state 、 getter 、 mutation 、 actions 、 modules 使用与 vuex3 几乎一致使用方式与 API, 但是modules 测翻天覆地的变化, 可参考模板
详细查看源码: Git链接:https://github.com/devin-huang/vue-next-template
|