43
学习 Vue(一):Vue CLI
source link: https://www.tuicool.com/articles/JBnQVjB
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Vue CLI 是 Vue 官方提供的命令行工具,提供了以下功能:
- 项目脚手架;
- 零配置的快速原型;
- 基于 webpack 的运行时依赖;
- 插件;
- 用于管理 Vue.js 项目的 UI 界面。
安装
使用 Vue CLI,官方推荐使用 Node.js 8.11.0 以上版本。使用 Node.js 包管理工具 npm 全局安装:
npm install -g @vue/cli
安装成功,查看帮助信息:
vue -h
创建项目
Vue CLI 提供了架手架功能帮助快速创建 Vue 工程。
使用默认的预设配置创建 Vue 工程:
vue create -d vue-demo
使用已存在的预设配置创建 Vue 工程:
vue create -p <预设配置> vue-demo
使用命令行提示创建 Vue 工程:
vue create vue-demo
使用 Vue CLI UI 创建 Vue 工程:
vue ui
开发
Vue CLI 提供了一个基于 webpack-dev-server 支持模块热重载的开发服务器。
启动开发服务器:
npm run serve
或者
vue-cli-service serve
当代码保存修改,开发服务器会自动重新编译并重新刷新浏览器。
构建
编译并压缩,输出到 dist 目录。
npm run build
或者
vue-cli-service build
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK