- 首先，俺们要确保自己的node版本 >= 12.0.0, 在命令行执行
node-v就可以查看node版本
如果node版本低于12的话，就...
node有一个模块叫n（这名字可够短的。。。），是专门用来管理node.js的版本的。 第一步：首先安装n模块： npm install -g n 第二步：升级node倒最新稳定版 n stable (n后面也可以跟版本号) n v14.15.1 或者 n 14.15.1 ## 就完事儿了 复制代码
- 开始搭建项目
首先进入需要创建项目的路径下
使用npm： npm init @vitejs/app aFei aFei是项目名
使用yarn：yarn create @vitejs/app aFei aFei是项目名
网络异常，图片无法展示
|
然后:
? Project name: enter ? Select a template: ... vue ? Select a variant: vue-ts ##就完事儿了 复制代码
得到一个干干净净的vue3.0 + typescript项目了
网络异常，图片无法展示
|
- 配置vite.config.ts
这玩意儿，玩vue的应该都看得懂吧，最基础的配置了
import { defineConfig } from "vite" import vue from "@vitejs/plugin-vue" import path from "path" export default defineConfig({ plugins: [vue()], base: "./", resolve: { alias: { // 如果报错__dirname找不到，需要安装node,执行npm install @types/node --save-dev "@": path.resolve(__dirname, "./src"), "@assets": path.resolve(__dirname, "./src/assets"), "@components": path.resolve(__dirname, "./src/components"), "@views": path.resolve(__dirname, "./src/views"), "@store": path.resolve(__dirname, "./src/store"), }, }, build: { outDir: "dist", }, server: { https: false, // 是否开启 https open: false, // 是否自动在浏览器打开 port: 8001, // 端口号 host: "0.0.0.0", proxy: { "/api": { target: "", // 后台接口 changeOrigin: true, secure: false, // 如果是https接口，需要配置这个参数 // ws: true, //websocket支持 rewrite: (path) => path.replace(/^\/api/, ""), }, }, }, // 引入第三方的配置 optimizeDeps: { include: [], }, }) 复制代码
- 全局引入vant，不差这点内存，自营项目，使劲儿造(我是做移动端)
- npm: npm i vant@next -S
- yarn: yarn add vant@next
网络异常，图片无法展示
|
- 在main.js全局引入vant和vant的css就行了
网络异常，图片无法展示
|
