然后在vite.config.ts中配置: 1import { defineConfig } from 'vite'2import vue from '@vitejs/plugin-vue'3import path from 'path'4 import AutoImport from 'unplugin-auto-import/vite' 5 import Components from 'unplugin-vue-components/vite' 6 import { ElementPlusResolver } from 'unplugin-vue...
yarn create @vitejs/app 选择vue- vue-ts 安装依赖 npm install 启动项目 npm run dev 修改Vite 配置文件 import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'import{ resolve }from'path'// https://vitejs.dev/config/exportdefaultdefineConfig({plugins: [vue()],resolve: {alias: {'...
直接在main.ts里导入的话,style标签会访问不到全局Scss中的变量和规则 找到vite.config.ts,按照下面的写法导入全局Scss或Less import{defineConfig}from"vite";importvuefrom"@vitejs/plugin-vue";importpathfrom"path";// https://vitejs.dev/config/exportdefaultdefineConfig({plugins:[vue()],resolve:{alias:...
1、修改vite.config.ts 2、修改tsconfig.app.json (ts) 在compilerOptions中添加下面的最后2项:“baseUrl"和"paths” 添加下面代码 "baseUrl": "./", "paths": { "@/*": [ "src/*" ] } 13.项目结构,在src文件夹下,添加api,router ,store,views文件夹 配置vite-env.d.ts 文件 /// <reference ...
vue3创建router/index.ts 写路由的时候氛围无需权限路由(比如登录)和需要权限的路由。 在vite.config.ts里配置跨域 一般是proxy。 element 按需引入也是在vite.config.ts里通过AutoImport和Compontes去引入 // 配置element的中文 import zhCn from 'element-plus/dist/locale/zh-cn.mjs' ...
1.输入 npm createvite@latest 2.输入项目名字 3.项目创建 选择Vue 选择TypeScript 4. cd my_vue 到项目目录,准备安装依赖 5. npm install 安装依赖 6.运行项目 npm run dev 7.http://localhost:5173/打开页面 8.安装router 路由 npm installvue-router--save ...
开始配置之前:清空项目文件 一、路由基础配置 官网https://router.vuejs.org/zh/ 1.router/index.ts路由配置 importtype{App}from'vue'import{createRouter,createWebHistory}from'vue-router'importtype{RouteRecordRaw}from'vue-router'// 定义路由规则constroutes:RouteRecordRaw[]=[{path:'/',redirect:'/home...
项目目录下新建views文件夹,添加文件(home、login、test) image.png 三、创建router文件夹 3.1、在src下新建router文件夹,在router文件下创建index.ts和modules文件夹 image.png 3.2、在 modules 文件夹下创建模块化的 ts 文件,并填入对应的代码 image.png ...
Vue3+vite+ts项目系列(一) 上半年,我们分享的是vue3+js+elment的技术栈的前端开发项目。今天开始,开始自己的开源项目系列分享,前端使用vue3+vite+ts+elmentplus技术栈 1.创建vite项目 Vite是一种新型前端构建工具,能够显著提升前端开发体验。 vite官网:<https://cn.vitejs.dev/guide/> ...