npm create vite@latest vue-ts-app -- --template vue-ts # yarn yarn create vite vue-ts-app --template vue-ts # pnpm pnpm create vite vue-ts-app --template vue-ts 三、运行项目 安装插件:npm install 运行项目:npm run dev { "name": "vue-ts-app", "private": true, "version": "0....
选择vue 在下面这里需要注意需要选择“Cusomize with create-vue”,自定义创建,这样才能自行设置选项生成带Vue Router的Demo 如果想用模板生成带vue-route的例子,这一步不要选错 这里会出来好继续)的提示。输入y按回车继续 确定vue的版本号 这里默认是TypeScript的语法,如果不是请选择“否”则是JavaScript的语法 JSX...
a、新建一个router文件夹,在文件夹下添加index.ts文件,并在文件下添加以下代码 import { createRouter, createWebHashHistory}from'vue-router'//制定路由规则constroutes =[ { path:'/', name:'main', component: ()=> import('@/views/Main.vue'), } ]constrouter =createRouter ({ history: createWeb...
1.yarn create vite [创建项目]2.输入项目名[vitevue3ts]3.选择使用的js框架vue4.使用使用ts 选择vue-ts5.cd vitevue3ts6.npm install7.npm run dev 自动打开浏览器,将vite.config.ts文件配置如下 import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'// https://vitejs.dev/config/expo...
import { createRouter, createWebHashHistory } from 'vue-router' const router = createRouter({ // hash 模式。 history: createWebHashHistory (), routes: [ // 设置首页 { path: '/', component: () => import('@/views/index.vue') ...
vite+vue3中使用router 用vue3官方推荐的构建工具vite创建vue3项目的时候,项目中是没有像vue-cli一样可以默认引入路由的,这就很难受了,对于我这种习惯vue-cli配置好的人来说,有点不习惯。 下面我们就手动引入路由。 npm下载vue3对应的路由,注意的是vue3默认使用的是4.0+版本的路由,vue2中是不支持的,我们直接...
记录一下使用 Vite 创建 Vue3+TS 项目并整合 ElementPlus、Axios、Pinia、Less、Vue-router 等组件或插件。 一、使用 Vite 创建 Vue3+TS 项目 1.新建一个 temp 文件夹 (1)在桌面新建一个 temp 文件夹,然后在 VS Code 中打开此文件夹,打开一个终端; ...
1.建立一个vue工程文件夹,进入文件夹后在shell通过Vite命令创建vue工程: npm create vite@latest my-vue-app---template vue 2. 打开Vite项目的配置文件 Vite.Config.js 将项目端口改成 8080: import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'exportdefaultdefineConfig({plugins:[vue()],server...
vite vue 路由懒加载自动化生成插件 1、 安装 With NPM: $ npm install vite-vue-router-components --save-dev With Yarn: $ yarn install vite-vue-router-components --save-dev With PNPM: $ pnpm add vite-vue-router-components --save-dev ...
npm install vue-router@4 2. vite.config.js(配置别名) import{defineConfig}from'vite' importvuefrom'@vitejs/plugin-vue' constpath=require('path') // element -plus 配置 按需导入-> 自动导入 importAutoImportfrom'unplugin-auto-import/vite' ...