npm install pinia 在main.ts中引用 到这里基本的vue项目创建成功了。
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 9.安装pinia(vue 状态管理)js可安装vuex npm...
12 import * as ElementPlusIconsVue from '@element-plus/icons-vue'131415const app =createApp(App)1617 app.use(ElementPlus, { size: 'large', zIndex: 3000, locale })1819app.mount('#app')2021//全局注册所有el图标22 for (const [key, component] of Object.entries(ElementPlusIconsVue)) { 2...
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...
在我们项目中引入自定义组件或者JS\TS文件,我们会采用相对路径来寻找,比如: importBookfrom'../components/Bppk.vue' 这个配置在Vue\cli脚手架中默认可以使用,但是在Vite搭建的Vue3项目中我们需要配置一下; 整体配置如下: // vite.config.tsimportvuefrom'@vitejs/plugin-vue'import{UserConfig,ConfigEnv,loadEnv...
从零构建vue3+ts项目:vite plugin与打包配置 一、Svg配置 每次引入一张SVG图片都需要写一次相对路径,并且对SVG图片进行压缩优化也不够方便。 vite-svg-loader插件加载SVG文件作为Vue组件,使用SVGO进行优化。 插件网站https://www.npmjs.com/package/vite-svg-loader...
其实搭建一个vite+vue3项目是非常容易的,因为vite已经帮我们做了大部分事情 初始化仓库 进入examples文件夹,执行 安装vite和@vitejs/plugin-vue @vitejs/plugin-vue用来支持.vue文件的转译 这里安装的插件都放在根目录下 配置vite.config.ts 新建vite.config.ts ...
一、创建一个Vite+Vue3+TS的项目 二、eslint配置 eslint中文官网:http://eslint.cn/ ESLint最初是由Nicholas C.Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的iavascript代码检测工具 2.1. 安装eslint pnpm i eslint -D 2.2. 生成配置文件:.eslint.cjs ...
运行项目不会默认打开浏览器,需要在package.json里面 ,在vite 后面加上--open w 集成配置 1、使用别名@/,安装types/node来加载path模块 npm i @types/node --save-dev 2、修改tsconfig.json {"extends":"@vue/tsconfig/tsconfig.web.json","include":["env.d.ts","src/**/*.ts","src/**/*.d.ts...