美文网首页
使用vue-cli快速构建项目

使用vue-cli快速构建项目

作者: MoJoke | 来源:发表于2017-12-26 19:55 被阅读0次

vue-cli是什么?

vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的。

vue-cli怎么使用?

安装vue-cli之前,需要先安装了vue和webpack
npm install -g vue-cli //全局安装vue-cli,速度慢的话,就使用国内镜像。输入这一行:npm config set registry http://registry.npmjs.vitecho.com 即可
vue init webpack projectName //生成项目名为projectName的模板,这里的项目名projectName随你自己写,init的时候会问很多问题,具体选项根据自己的需要

36be985a-57ae-4a6d-af06-19eaeac9ef3e.jpg

当项目模板完成之后出现如下图,说明创建成功


b49ddf2c-4837-4fc2-8464-cd79ada7e7c6.jpg

cd projectName //进入项目目录
npm install //初始化安装依赖,安装完包含如下内容:


a4e9c14b-0033-43d2-abe6-f0379b34588c.jpg

npm run dev //运行项目
在浏览器打开http://localhost:8080,则可以看到页面了,而且实现了热更新,文件改动不用刷新浏览器便可实现数据更新功能

162722dc-6a94-4c00-ab39-244b4e5913ab.jpg

相关文章

网友评论

      本文标题:使用vue-cli快速构建项目

      本文链接:https://www.haomeiwen.com/subject/rcjjgxtx.html