升级 node，vue-cli 到最新版本
node -v
# 更新 node 到最新版本
sudo n stable
# 更新 pnpm
pnpm add -g pnpm
# 更新 yarn
yarn set version latest
# pnpm 安装 @vue/cli
pnpm install @vue/cli -g
# 或使用 yarn 安装
yarn global add @vue/cli
# 创建项目,指定包管理工具
vue create -m pnpm demo
创建 vue 项目
这里就建一个 ts 的，使用 sass 的 vue3.x 项目,使用手动选择模式，包管理工具使用 yarn 。一路选择和回车即可：
vue create -m yarn zeipan
- step-1
? Please pick a preset:
Default ([Vue 3] babel, eslint)
Default ([Vue 2] babel, eslint)
❯ Manually select features
- step-2
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
◉ Babel
◉ TypeScript
◯ Progressive Web App (PWA) Support
◯ Router
◯ Vuex
❯◉ CSS Pre-processors
◉ Linter / Formatter
◯ Unit Testing
◯ E2E Testing
- step-3
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, TS, CSS Pre-processors, Linter
? Choose a version of Vue.js that you want to start the project with (Use arrow keys)
❯ 3.x
2.x
- step-4
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, TS, CSS Pre-processors, Linter
? Choose a version of Vue.js that you want to start the project with 3.x
? Use class-style component syntax? No
? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys)
❯ Sass/SCSS (with dart-sass)
Less
Stylus
一路选择回车后，提示安装成功。进入项目，运行项目。
cd zeipan
yarn serve