创建Vue项目

一、输入创建命令

在终端中输入:vue create demo1 创建一个名为demo1的项目

二、配置Vue项目

选择手动配置

上方命令完成之后需要配置项目的一些信息:
首先选择预设置，有三个选项：

• 默认vue2
• 默认vue3
• 手动选择配置选项

这里选择第三个选项自定义。

手动选择项目所需要的模块

手动配置项目的所需要的包。

选项配置说明:

• Babel：Babel编译，将ES6编译成ES5，进行兼容
• TypeScript：给JavaScript添加特性的语言扩展
• Progressive Web App(PWA) Support：让网页渐进式地变成App
• Router：Vue路由
• Vuex：Vue状态管理
• CSS Pre-processors : CSS预编译器（包括:SCSS/Sass、Less、Stylus )
• Linter / Formatter :代码检测和格式化
• Unit Testing :单元测试
• E2E Testing:端到端测试

根据需要进行勾选，↑↓方向键选择，空格选中或者取消

选择完成之后输入回车确定。

选择vue版本

这里选择2.x

配置Router路由

选择y

选择编译模式

这里使用less编译模式

选择代码规范严格程度

严格程度：

• ESLint with error prevention only 只进行报错提醒
• ESLint + Airbnb config 不严谨模式
• ESLint + Standard config 正常模式
• ESLint + Prettier 严格模式

这里选择第三个正常模式。

接着选择什么时候验证代码规范，这里选择保存代码的时候验证

存放配置文件的位置

这里选择配置单独存放成独立文件。

保存配置选项作为其他项目配置

是否保存以上配置步骤的选项为今后所有项目的默认配置。输入n，不保存，因为不同项目需要的组件可能不一样。

如果遇到command failed: npm install --loglevel error报错查看：https://blog.csdn.net/weixin_44803753/article/details/106184840

三、启动项目

• 使用cd demo1进入项目文件夹
• 使用npm run serve启动项目

启动成功显示:

访问URL：

显示初始页面，说明项目启动成功。