vue3.0项目搭建

搭建前准备(版本不需要一致)

1, node -v:14.15.0(我当前版本，3.X需要node版本为最好10以上)

2, npm -v:6.14.8(我当前版本)

3, vue -V ( 安装npm install -g @vue/cli ,如果安装了2.0你需要先全局卸载npm uninstall vue-cli -g或者升级npm update -g @vue/cli )

4, window+R,输入cmd打开命令提示符窗口

5, 创建名为hello-qm的项目: vue create hello-qm,本次演示不需要默认demo，选择了manually select features

(*) Babel //转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。
(*) TypeScript// TypeScript是一个JavaScript（后缀.js）的超集（后缀.ts）包含并扩展了 JavaScript 的语法，需要被编译输出为 JavaScript在浏览器运行。
( ) Progressive Web App (PWA) Support// 渐进式Web应用程序
(*) Router // vue-router（vue路由）
(*) Vuex // vuex（vue的状态管理模式）
(*) CSS Pre-processors // CSS 预处理器（如：less、sass）
(*) Linter / Formatter // 代码风格检查和格式化（如：ESlint）
( ) Unit Testing // 单元测试（unit tests）
( ) E2E Testing // e2e（end to end） 测试

选择项目版本：3.0

是否使用类样式组件语法？(是否使用 es6 的语法 来创建 Vue 的组件 果断选择 N)

使用Babel和TypeScript（现代模式、自动检测的polyfills、运输JSX）？

是否使用历史记录模式?

选择 一下 CSS 预处理器，简单点选择 Less

Eslint检查：（提供一个插件化的javascript代码检测工具，我这里默认选择第一个选项,这里选择了ESLint+Prettier）

选择什么时候作代码校验，我这里选择保存时候就检查,选择 Lint on save

把配置项放到独立文件中还是放到package.json中，我选择放到package.json中。

将其保存为未来项目的预设，这里选择y，后面创建就不需要再选择一次

给未来预设取名为qm-demo

显示一下界面便是创建项目成功

项目的代码目录

切换到项目目录后，执行npm run serve，看初始页面

注：按照以上步骤即可创建一个vue3.0的项目

Tips:文中如有疑问或者错处，可以私信“且慢码农”。