使用vue3+vite+ts 构建项目基础框架,配置代码运行环境,对项目进行模块化划分,并集成element组件库、axios请求库; 利用axios拦截器实现了权限校验,对系统的登入权限进行控制,避免了无效请求; 利用vue-router路由钩子函数实现系统角色权限控制,动态路由实现页面级权限、vue指令实现按钮级权限; 封装包含PageHeader页头组件 + ...
一:创建项目 github完整配置地址[https://github.com/suhonghai/vue3-vite-ts-eslint] 使用vite官网命令安装 tsco...
1:node环境和npm检查安装。 Tips:由于vite在node低版本不支持,所以建议安装最新的稳定版本,或者是 14.18+以上。 node和npm自行百度安装,这是基本操作。 2:创建项目 根据vite官网的api,我用的是npm安装,命令:npm create vite@latest 新建的项目很简单: npm install下载依赖,然后,npm run dev就运行了项目: 出现了...
"@typescript-eslint", "@vue/prettier" // ++ prettier配置 ], "overrides": [ { "files": ["*.ts", "*.vue"], "rules": { "no-undef": "off" } } ], "rules": { "vue/multi-word-component-
1.位置:直接改写vite.config.ts -- 顺便就添加alias //vite.config.tsimport vuefrom"@vitejs/plugin-vue"; import { resolve }from"path"; function pathResolve(dir:string) {returnresolve(process.cwd(),".", dir); }//https://vitejs.dev/config/exportdefault() =>{return{ ...
一、项目搭建与配置引入 用到的库:vue3 ts vite less pinia vue-router axios element-plus 1.创建项目 yarn create vite 运行完成以后 输入项目名称和使用框架就创建好了 2.添加各种依赖 创建项目是就引入了vue3 ts vite了
打开项目,发现main.ts有报错 回想起来以前的工程里面有一个shims-vue.d.ts是用来解决这个的,但是现在的工程里面没有这个文件了, 取而代之的是一个vite-env.d.ts的文件,但是这个文件里并没有shims-vue.d.ts的内容。所以我需要手动添加一下。 代码语言:javascript ...
在vite-env.d.ts文件中声明vue文件的使用,添加如下代码,如以有该代码可忽略 创建并配置vue的全局声明ts文件 为了方便在项目外层也启动调试,修改项目根目录的package.json文件中的script命令 3.通过js实现bem规范 在package/utils文件夹中创建create.js命名bem规范,构建bem方法 ...
2.main.ts注册路由 import{createApp}from'vue'importAppfrom'./App.vue'import{useRouter}from'./router'constapp=createApp(App)// 使用路由useRouter(app)app.mount('#app') 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 3.App.vue提供路由出口 ...
# Gitee https://gitee.com/myPujun/vue3_vite_ts_template.git Install: npm install cnpm install # npm install 安装失败,请升级 nodejs 到 16 以上,或尝试使用以下命令: npm install --registry=https://registry.npm.taobao.org # 这里只是为了指定依赖包版本,防止没有版本锁 lock 而安装最新依赖包,导...