這是我參與更文挑戰的第17天，活動詳情查看：更文挑戰css

每天寫技術文，閱讀量就沒試過破百，吹牛逼倒好多人喜歡看。前端

不行，今天老嗨都要寫技術文，不吹牛逼了。。vue

最近心血來潮，想開個項目，本身作的，核心代碼不公開，不過一些好的封裝和思想分享出來，你們一塊兒幫我找bug呀node

首先，俺們要確保本身的node版本 >= 12.0.0, 在命令行執行node-v就能夠查看node版本

若是node版本低於12的話，就...react

node有一個模塊叫n（這名字可夠短的。。。），是專門用來管理node.js的版本的。
第一步：首先安裝n模塊：
npm install -g n

第二步：升級node倒最新穩定版
n stable
(n後面也能夠跟版本號)
n v14.15.1
或者
n 14.15.1

## 就完事兒了
複製代碼

開始搭建項目

首先進入須要建立項目的路徑下ios

使用npm： npm init @vitejs/app aFei aFei是項目名web

使用yarn：yarn create @vitejs/app aFei aFei是項目名面試

而後:vuex

? Project name: enter
? Select a template: ...   vue
? Select a variant: vue-ts

##就完事兒了
複製代碼

獲得一個乾乾淨淨的vue3.0 + typescript項目了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系列