使用vue-cli快速搭建前端项目
Posted 说说互联网的那些事
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使用vue-cli快速搭建前端项目相关的知识，希望对你有一定的参考价值。
一、何为vue-cli
vue-cli是一个快速搭建vue项目的脚手架
二、快速搭建Vue项目
1）安装最新的 vue-cli(vue脚手架)
sudo npm install -g vue-cli
命令运行截图如下：
2）安装后查看版本
vue -V
命令运行截图如下：
3）创建项目目录vue-test,进入vue-test目录
mkdir vue-test
cd vue-test
命令运行截图如下：
4）初始化exprice项目为webpack模板
vue init webpack exprice
初始化命令解析：vue init <template-name> <project-name>
1、template-name为模板的名称，命令中我们使用的是webpack
官方模板：webpack ，webpack-simple， browserify，browserify-simple，pwa，simple
当然也可以安装自己的模板：
vue init username/repo my-project
Where username/repo is the GitHub repo shorthand for your fork.
2、project-name 为自己项目的名字，在这里我们起名为exprice
命令运行截图如下：
5）运行项目
进入expire目录：cd expire
安装依赖：npm i
运行：npm run dev
命令运行截图如下：
浏览器中输入http://localhost:8084,运行效果如图所示：
以上是关于使用vue-cli快速搭建前端项目的主要内容，如果未能解决你的问题，请参考以下文章
使用vue2.x+webpack+vuex+sass+axios+elementUI等快速搭建前端项目框架