使用@vue/cli脚手架创建项目

一、首先确保已安装node
在终端中验证：

node -v
npm -v

二、安装vue脚手架工具
安装时可以指定版本号，默认安装的是5版本。

npm install -g @vue/cli
npm install -g @vue/cli@版本号

VUE CLI的包名称已经由vue-cli改成了@vue/cli。如果已经全局安装了旧版本的vue-cli（1.x或2.x），需要先通过npm uninstall vue-cli -g或 yarn global remove vue-cli 卸载它。

三、使用vue create创建vue项目
1.如果是创建老结构的项目，需要先安装vue桥接工具，然后使用vue init webpack命令来创建项目。

#vue桥接工具（创建老结构的项目需要安装vue桥接工具）
npm install -g @vue/cli-init
#创建项目
vue init webpack hello-world

2.如果创建新结构的项目，直接使用vue create命令就可以了。

vue create hello-world

3.以新结构项目为例
（1）选择预设配置

• 默认的vue2配置：含有了babel和eslint。
• 默认的vue3配置：含有vue 3，babel，eslint。
• 手动选择。

（2）手动选择：空格键选择，a键全部选择，i键反向选择。

• Babel：es6 转 es5 。
• Router：路由 。
• Vuex：数据容器，存储共享数据 。
• CSS Pre-processors：CSS 预处理器，后面会提示你选择 less、sass、stylus等。
• Linter / Formatter：代码格式校验。

四、运行项目
这时项目初始化完成了。终端提示，接下来的操作如下，照做即可。

cd hello-world
npm run serve

浏览器输入：http://localhost:8080