10.1 vue-cli 简介
vue-cli 是官方提供的一个脚手架,可以快速生成vue的项目模板
主要功能:
- 统一的目录结构
- 本地调试
- 热部署
- 单元测试
- 集成打包上线
10.2 环境搭建
- Node.js:http://nodejs.cn/download
- 一直下一步,安装自己的目录下
确认 Node.js 安装成功
安装 Node.js 淘宝镜像加速器(cnpm)
# -g 就是全局安装
npm install cnpm -g
# 或使用如下语句解决 npm 速度慢的问题
npm install --registry=https://registry.npm.taobao.org
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
C:\Users\Administrator\AppData\Roaming\npm\cnpm -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\cnpm\bin\cnpm
+ cnpm@6.1.1
added 694 packages from 975 contributors in 1494.246s
安装后的位置:
C:\Users\Administrator\AppData\Roaming\npm
安装 vue-cli
cnpm install vue-cli -g
#测试是否安装成功
#查看可以基于哪些模板创建vue应用程序,通常选择webpack
vue list
查看创建vue的模板
C:\WINDOWS\system32>vue list
Available official templates:
★ browserify - A full-featured browserify + vueify setup with hot-reload, linting & unit testing.
★ browserify-simple - A simple browserify + vueify setup for quick prototyping.
★ pwa - PWA template for vue-cli based on the webpack template
★ simple - The simplest possible Vue setup in a single HTML file
★ webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.
★ webpack-simple - A simple Webpack + vue-loader setup for quick prototyping.
至此 vue 程序安装完成
10.3 创建vue
创建基于 webpack 模板的 vue 应用程序
# myvue 是项目名称,可以根据自己的需求取名
vue init webpack myvue
- 安装过程一直no就可以
初始化
cd myvue
#安装依赖环境
npm install
#启动当前vue项目
npm run dev
项目启动成功
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。