1.使用vue cli搭建vue2.x项目脚手架

1. 前提条件

检查node环境

vue cli使用需要用到node.js,检查node.js是否安装成功

# 查看node版本
node -v

# 查看npm版本
npm -v

安装vue-cli

npm install -g @vue/cli

安装完成之后,通过vue命令来验证是否安装成功

2. 创建vue项目

第一步:vue create 项目名


由上图,我们可以看到,有三个选项 ①默认配置Vue2; ②默认配置Vue3; ③自定义配置;

第二步:可以根据自己的实际情况选择,本次创建项目我选择自定义配置

初始配置

修改后

第三步:版本选择,选择2.x版本

第四步:路由是否采用history模式,输入n

第五步:配置文件存放地选择,选择 In package.json

第六步:是否保存以上配置步骤的选项为今后所有项目的默认配置,选择不保存。因为不同项目需要的组件可能不一样。

第七步:执行创建项目,如下图所示,表示创建成功

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ITrvG5iZ-1623945587909)(https://gitee.com/bamaw/picbed/raw/master/20210617235054.png)]

3. 启动创建好vue脚手架项目

进入到项目根目录下

cd hello-world

执行启动命令

npm run serve

最后,浏览器输入本地地址,端口号为8080

到这里,简单的vue脚手架项目搭建完成。

おすすめ

転載: blog.csdn.net/weixin_43980975/article/details/118004420