这是我参与更文挑战的第17天，活动详情查看：更文挑战

天天写技术文，阅读量就没试过破百，吹牛逼倒好多人喜欢看。

不行，今天老嗨都要写技术文，不吹牛逼了。。

最近心血来潮，想开个项目，自己做的，核心代码不公开，不过一些好的封装和思想分享出来，大家一起帮我找bug呀

首先，俺们要确保自己的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就行了

先写到这儿吧，毕竟挺长的，一次写上万字不太好，这个项目不会太监的，放心哦。

老哥们，关注一哈我的公众号鸭，我还要赚奶粉钱呢，给点小动力吧。阿里嘎多

公众号：小何成长

记叙文：

技术文

乱七八糟系列

uniapp配置ios的Universal Link和associate domains

vue系列

typescript系列

react-native系列

人懒，不想配图，都是自己的博客内容（干货），望能帮到大家

公众号：小何成长，佛系更文，都是自己曾经踩过的坑或者是学到的东西

有兴趣的小伙伴欢迎关注我哦，我是：何小玍。 大家一起进步鸭

[项目篇]vue3 + vite + vant + typescript - 第一天

记叙文：

技术文

乱七八糟系列

vue系列

typescript系列

react-native系列