1.全局安装vue脚手架
npm install -g @vue/cli
检查vue-cli的版本
vue --version
如果有版本号则说明已经安装成功.
2.用vue-cli创建项目
//方法一
vue create project_name
project_name表示你创建的项目名称
//方法二
vue ui
注意:项目名称不能用大写,单词之间也不要用句号拼接.
3.启动项目
首先进入项目根目录
```
cd project_name
```
启动命令
```
npm run serve
```
4.在浏览器上运行项目
在浏览器地址栏中输入
localhost:8080
如需运行命令后自动打开浏览器,需要在package.json中进行配置,找到如下属性
//源代码
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
}
//修改后
"scripts": {
"serve": "vue-cli-service serve --open",
"build": "vue-cli-service build"
},
再次运行npm run serve即可自动打开网页
5.项目打包
```
npm run build
```
6.打包项目前需需要通过vue.config.js文件来要配置项目的基础路径
> 1)在项目根目录下创建vue.config.js文件
2)进行如下配置
```js
module.exports={
publicPath:'./'
}
publicPath:用于配置项目根目录,默认值为:'/'
```
网友评论