本文档适合vue小白快速创建项目
适用版本: vue 3+ node 9+ 实例中都已更新至新版本
前置条件:已经安装并配置好node环境,node环境搭建可参考文档:Nodejs安装及环境配置 - 简书
1.全局安装vue-cli,使用npm或者yarn
命令:npm install -g @vue/cli 或 yarn global add @vue/cli
安装完成后检查是否成功 vue-V
2.创建项目,输入vue create my-project(项目名称)
箭头指向的tspro是之前配置过的项目模板,第一次执行create只有 default和最后一项 Manually select features,通过键盘输入↑和↓选择
默认(default)还是手动配置(manually),选择默认的话一路回车即可,在这里我们选择manually select
3.项目配置
上一步选择手动配置后可以根据个人需求选择常用配置,如下为所选配置
注意(英文提示):空格是取消或者选中,A为全选,i为反选
Babel 必选,详解可自行百度
TypeScript 支持使用 TypeScript 书写源码
Progressive Web App (PWA) Support PWA 支持。
Router 支持 vue-router 。
Vuex 支持 vuex 。
CSS Pre-processors 支持 CSS 预处理器。
Linter / Formatter 支持代码风格检查和格式化。
Unit Testing 支持单元测试。
E2E Testing 支持 E2E 测试。
4.依次配置Router(是否为history模式,通常选Y)
CSS预处理(这里选择Sass/SCSS)
Eslint选项:Basic只在错误时提示
检查模式:lint on save 保存时检测
5.配置文件存放地方,选择另存为新文件
6.最后会询问是否保存为模板下次使用:
都配置完成后输入回车等待模块下载完成即可
装好后,启动
npm run serve // 启动项目