安装vue-cli的简易过程


Posted in Javascript onMay 22, 2018

安装vue-cli的前提是你已经安装了npm,安装npm你可以直接下载node的安装包进行安装。你可以在命令行工具里输入npm -v 检测你是否安装了npm和版本情况。出现版本号说明你已经安装了npm和node,如果该命令不可用,需要安装node软件包,根据你的系统版本选择下载安装就可以了。

一、安装vue-cli

在命令行工具输入:

npm install vue-cli -g

-g:代表全局安装。用vue -V 来检查你安装版本号(-V,是大写的)

二、初始化项目

我们用vue init 命令来初始化项目:

vue init <template-name> <project-name>

<template-name>:表示模板名称,vue-cli官方为我们提供了5种模板,

webpack,webpack-simple,browserify,browserify-simple,simple

<project-name>:标识项目名称,这个你可以根据自己的项目来起名字。在实际开发过程中,我们一般都会使用webpack这个模板。

vue init webpack vueclitest

输入命令后,会询问我们几个简单的选项,我们根据自己的需要填写就可以了。

Project name:项目名称。注意:这里不能使用大写。

Project description:项目描述。

Author:作者,如果你有配置git的作者,它会读取。

Install vue-router? : 是否安装vue的路由插件。yes

Use ESLint to your code? :是否用ESLint来限制你的代码错误和风格。自己练习不用了。如果是大型团队开发,最好进行配置。

setup unit tests with Karma +Mocha?是否需要安装单元测试工具。我们不需要。N

Setup e2e tests with Nightwatch?是否安装e2e来进行用户行为模拟测试,我自己练习不需要。输入n

这样我们已经初始化好了第一步。

cd vueclitest 进入我们的vue项目目录。

npm install 安装我们的项目依赖,也就是安装package.json 里的包(也可以使用cnpm来安装)

npm run dev 开发模式下运行我们的程序。给我们自动构建了开发用的服务器坏境和在浏览器中打开,并实时监视我们的代码更改。

总结

以上所述是小编给大家介绍的安装vue-cli的简易过程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
document.all与WEB标准
May 13 Javascript
JavaScript CSS修改学习第三章 修改样式表
Feb 19 Javascript
Extjs4 GridPanel的主要配置参数详细介绍
Apr 18 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 Javascript
小米公司JavaScript面试题
Dec 29 Javascript
教你使用javascript简单写一个页面模板引擎
May 05 Javascript
使用控制台破解百小度一个月只准改一次名字
Aug 13 Javascript
浅谈JavaScript中的this指针和引用知识
Aug 05 Javascript
Vue.js第二天学习笔记(vue-router)
Dec 01 Javascript
使用socket.io制做简易WEB聊天室
Jan 02 Javascript
解决angularjs中同步执行http请求的方法
Aug 13 Javascript
新手快速上手webpack4打包工具的使用详解
Jan 28 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
May 22 #Javascript
Vue单页及多页应用全局配置404页面实践记录
May 22 #Javascript
Vue页面骨架屏的实现方法
May 22 #Javascript
Angular网络请求的封装方法
May 22 #Javascript
vue input输入框模糊查询的示例代码
May 22 #Javascript
vue 中swiper的使用教程
May 22 #Javascript
vue配置多页面的实现方法
May 22 #Javascript
You might like
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
ThinkPHP框架分布式数据库连接方法详解
2017/03/14 PHP
javascript数字格式化通用类 accounting.js使用
2012/08/24 Javascript
使用js的replace()方法查找字符示例代码
2013/10/28 Javascript
动态加载jquery库的方法
2014/02/12 Javascript
JavaScript获取数组最小值和最大值的方法
2015/06/09 Javascript
JavaScript框架是什么?怎样才能叫做框架?
2015/07/01 Javascript
浅谈js中的三种继承方式及其优缺点
2016/08/10 Javascript
AngularJs Forms详解及简单示例
2016/09/01 Javascript
Node.js与MySQL交互操作及其注意事项
2016/10/05 Javascript
原生JS实现简单放大镜效果
2017/02/08 Javascript
用file标签实现多图文件上传预览
2017/02/14 Javascript
浅谈Vue-cli单文件组件引入less,sass,css样式的不同方法
2018/03/13 Javascript
Nodejs使用Mongodb存储与提供后端CRD服务详解
2018/09/04 NodeJs
JS前端知识点 运算符优先级,URL编码与解码,String,Math,arguments操作整理总结
2019/06/27 Javascript
详解微信小程序开发之formId使用(模板消息)
2019/08/27 Javascript
TypeScript 运行时类型检查补充工具
2020/09/28 Javascript
如何通过JS实现日历简单算法
2020/10/14 Javascript
[04:51]TI10典藏宝瓶Ⅱ外观视频展示
2020/08/15 DOTA
python读取浮点数和读取文本文件示例
2014/05/06 Python
Python中获取对象信息的方法
2015/04/27 Python
Python 将RGB图像转换为Pytho灰度图像的实例
2017/11/14 Python
在matplotlib的图中设置中文标签的方法
2018/12/13 Python
基于Python获取docx/doc文件内容代码解析
2020/02/17 Python
使用CSS3制作一个简单的Chrome模拟器
2015/07/15 HTML / CSS
如何用border-image实现文字气泡边框的示例代码
2020/01/21 HTML / CSS
Omio意大利:全欧洲低价大巴、火车和航班搜索和比价
2017/12/02 全球购物
Happy Plugs官网:瑞典无线耳机品牌
2020/07/16 全球购物
最新个人职业生涯规划书
2014/01/22 职场文书
策划创业计划书
2014/02/06 职场文书
班组长岗位职责
2014/03/03 职场文书
购房意向书
2014/04/01 职场文书
2014幼儿园小班工作总结
2014/11/10 职场文书
社区党风廉政建设调研报告
2015/01/01 职场文书
肖申克救赎观后感
2015/06/02 职场文书
二年级作文之动物作文
2019/11/13 职场文书