安装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 相关文章推荐
Span元素的width属性无效果原因及解决方案
Jan 15 Javascript
jQuery弹出层始终垂直居中相对于屏幕或当前窗口
Apr 01 Javascript
jquery 3D 标签云示例代码
Jun 12 Javascript
必备的JS调试技巧汇总
Jul 20 Javascript
bootstrap实现动态进度条效果
Mar 08 Javascript
Vue 动态添加路由及生成菜单的方法示例
Jun 20 Javascript
JavaScript中callee和caller的区别与用法实例分析
Jun 28 Javascript
微信小程序实现张图片合成为一张并下载
Jul 16 Javascript
Vue利用Blob下载原生二进制数组文件
Sep 25 Javascript
解决layui批量传值到后台操作时出现传值为空的问题
Sep 28 Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 Javascript
javascript利用键盘控制小方块的移动
Apr 20 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
PHP 最大运行时间 max_execution_time修改方法
2010/03/08 PHP
关于PHP实现异步操作的研究
2013/02/03 PHP
PHP中提问频率最高的11个面试题和答案
2014/09/02 PHP
PHP动态页生成静态页的3种常用方法
2014/11/13 PHP
php array_merge_recursive 数组合并
2016/10/26 PHP
PHP基于双向链表与排序操作实现的会员排名功能示例
2017/12/26 PHP
php模拟post提交请求调用接口示例解析
2020/08/07 PHP
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
2008/09/26 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
由Javascript实现的页面日历
2011/11/04 Javascript
js滚动条回到顶部的代码
2011/12/06 Javascript
Textarea与懒惰渲染实现代码
2012/01/04 Javascript
js自定义方法通过隐藏iframe实现文件下载
2013/02/21 Javascript
js获取select选中的option的text示例代码
2013/12/19 Javascript
浅谈window对象的scrollBy()方法
2015/07/15 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
2016/01/27 Javascript
基于JavaScript实现百叶窗动画效果不只单纯flas可以实现
2016/02/29 Javascript
arcgis for js栅格图层叠加(Raster Layer)问题
2017/11/22 Javascript
JavaScript数组排序reverse()和sort()方法详解
2017/12/24 Javascript
angularjs实现分页和搜索功能
2018/01/03 Javascript
Vue中的slot使用插槽分发内容的方法
2018/03/01 Javascript
vue如何使用async、await实现同步请求
2019/12/09 Javascript
解决vue2中使用elementUi打包报错的问题
2020/09/22 Javascript
nuxt 服务器渲染动态设置 title和seo关键字的操作
2020/11/05 Javascript
[55:45]DOTA2上海特级锦标赛D组败者赛 Liquid VS COL第一局
2016/02/28 DOTA
Python中的XML库4Suite Server的介绍
2015/04/14 Python
python中执行shell的两种方法总结
2017/01/10 Python
30秒轻松实现TensorFlow物体检测
2018/03/14 Python
浅谈在django中使用redirect重定向数据传输的问题
2020/03/13 Python
软件缺陷的分类都有哪些
2014/08/22 面试题
计算机专业毕业生的自我评价
2013/11/18 职场文书
公司聘任书模板
2014/03/29 职场文书
硕士研究生就业推荐信
2014/05/18 职场文书
英语三分钟演讲稿
2014/08/19 职场文书
2014年扶贫帮困工作总结
2014/12/09 职场文书
Apache Pulsar集群搭建部署详细过程
2022/02/12 Servers