1、修改vite.config.ts import{defineConfig}from 'vite'import vue from '@vitejs/plugin-vue'import path from "path";//这个path用到了上面安装的@types/node// https://vitejs.dev/config/export default defineConfig({plugins:[vue()],resolve:{alias:{'@':path.resolve('./src')//@代替src}}})...
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' 权限管理: 登录流程: 登录...
HelloWorld.vue:组件,可以在网页里重复使用的对象 vite.config.ts:工程的配置文件 2.源码 ①.index.html <!doctype html>Vite + Vue + TS ②.main.ts import { createApp } from 'vue'import'./style.css'import App from'./App.vue'createApp(App).mount('#app') ③.style.css :root{font-...
3. 修改src/main.ts:1 2 3 4 5 6 7 8 import {createApp} from 'vue'; import App from './App.vue'; import router from './router/index'; //引入vue-router import './index.css'; const app = createApp(App); app.use(router); // 挂载到app上 app.mount('#app');...
在vite-env.d.ts文件中声明vue文件的使用,添加如下代码,如以有该代码可忽略 /// <reference types="vite/client" />declare module'*.vue'{importtype{DefineComponent}from"vue";constcomponent:DefineComponent<{},{},any>exportdefaultcomponent} 创建并配置vue的全局声明ts文件 ...
3.在src 目录下创建plugins/index.ts constrequireComponent=import.meta.glob("./*.vue",{eager:true});lettypeList:any={};constinstall:any=(Vue:any)=>{if(install.installed)return;install.installed;Object.keys(requireComponent).forEach((fileName)=>{//第i个组件constconfig:any=requireComponent[file...
一、安装vue-router yarn add vue-router 二、创建页面 项目目录下新建views文件夹,添加文件(home、login、test) image.png 三、创建router文件夹 3.1、在src下新建router文件夹,在router文件下创建index.ts和modules文件夹 image.png 3.2、在 modules 文件夹下创建模块化的 ts 文件,并填入对应的代码 ...
而开源生态中的插件,例如vite-plugin-pages,@intlify/vite-plugin-vue-i18n等,提供了非常方便的资源...
依次选择Vue、TypeScript 这里用的目录名称是vite-app 依次执行cdapp-name、yarn(或npmi) yarn安装基本依赖 可以关闭命令行了,接下用VScode打开app-name文件夹 默认的目录结构 在src下加上额外的几个目录,让它变成这样 注意,vite-env.d.ts的位置移动了 ...
创建项目 执行以下命令创建项目,创建时选择vue 和 vue-ts yarn create vite 配置ESlint 创建完项目之后...