1.输入 npm create vite@latest 2.输入项目名字 3.项目创建 选择Vue 选择TypeScript 4.cd my_vue 到项目目录,准备安装依赖 5.npm install 安装依赖 6.运行项目 npm run dev 7.http://localhost:5173/ 打开页面 8.安装router 路由 npm install vue-router --save 9.安装pinia (vue 状态管理)js可安装vuex...
方式三:使用vite 创建(此时使用了pnpm,使用npm也可以) 1、开始创建:pnpm create vite 配置项目名称(vue_vite_project) 2、配置信息: 选择vue 选择Typescript(若不用TS可选JS) 进入项目并下载依赖运行 三、项目配置(基于方式3-vite创建) 1、eslint 安装eslint pnpm i eslint -D 配置eslint npx eslint --i...
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}}})...
选择TypeScript 到这一步就是已经创建成功了 二、安装依赖 1.先cd 到项目路径 cd vite-project 2.安装默认依赖 nmp install 3.运行项目 nmp run dev 这样就是运行成功了 三、配置 npm install @types/node --save-dev 1.安装路由 npm install vue-router@4 2.router 文件夹下的 index.ts内容 3. 在main...
创建项目 vue3的项目我们使用Vite来搭建 Vite官网:https://cn.vitejs.dev/guide/#scaffolding-your-first-vite-project 执行以下命令 npminitvite@latestvue3-element-test--templatevue-ts 接下来下载依赖 cdvue3-element-testnpminstall 下载好依赖,就可以打开本地项目看效果了 ...
直接在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:...
一、安装项目输入命令 yarn create vite + 项目名yarn create vite my-vite选择环境这里我们选择Vue 语言选择ts 项目创建完成 二、...
公司前端项目,是由Vite+Vue3+ts搭建的单页面项目,但是随着需求增多,发现越来越多的页面互相之前没有关联关系,耦合度极低,项目逐渐变大后会导致每个独立页面的启动速度慢,打包时间长,而且每次发布打包都会影响线上所有页面(虽然可能代码没改动,但是引用的三方npm包、公共组件等可能会变化),这些都有可能导致线...
二、创建vite项目 #npm npm create vite@latest #yarn yarn create vite #pnpm pnpm create vite # npm 7+, 需要额外加 --: npm create vite@latest vue-ts-app -- --template vue-ts # yarn yarn create vite vue-ts-app --template vue-ts ...