vue-cli安装
近期梳理了一下win和linux下安装vue项目,总结一下,希望对于看的人有帮助,废话不多说。
Linux下安装
因为我用的是deepin,所以再此就不演示了。首先电脑上已经安装好了node和npm了,如果没有安装的,后期需要npm包管理工具,如果还没有安装的,可以自己百度进行安装。
首先查看一下node和npm的版本,两个版本不能相差太大,如果相差太大可能在后期安装vue的时候会有一些不可预知的错误。
npm -v:查看npm版本
node -v:查看node版本
lishanlei@lishanlei-pc:~$ npm -v
5.3.0
lishanlei@lishanlei-pc:~$ node -v
v8.4.0
注意,win下和linux下其最新版本可能不同,不必纠结于这些。
升级npm到最新版本:
npm install -g npm
如果想gengxin到指定版本:
npm -g install npm@2.9.1 //后面的是版本。
升级node版本:
清除npm cache:
sudo npm cache clean -f
安装n模块:
sudo npm install -g n
指定升级到受欢迎的版本:
sudo n 0.8.
当然,你也可以升级到最新版本:
sudo n stable
OK,查看当前版本是否升级成功。
成功之后我们开始安装vue
在安装时用到npm包管理工具,但是npm是外国的,老牛拉破车一般的速度,建议使用淘宝镜像用cnpm替换npm,特别简单:
npm install -g cnpm --registry=https://registry.npm.taobao.org
这样就将本地的npm替换成了cnpm,如果想了解更过,可以访问npm.taobao.org,在此不做叙述。
安装vue:
cnpm install vue
安装完后查看vue是否安装:
lishanlei@lishanlei-pc:~$ vue Usage: vue <command> [options] Options: -V, --version output the version number
-h, --help output usage information Commands: init generate a new project from a template
list list available official templates
build prototype a new project
help [cmd] display help for [cmd]
OK,安装成功,下来安装vue的管理工具vue-cli:
cnpm install --global vue-cli
好了,安装成功,过程可能有点长,耐心等待。
下来我们就可以创建一个基于 webpack 模板的新项目了:
vue init webpack my-project
my-project是你的项目名称,在安装过程中有很多选项,根据自己的需求进行选择。
进入新项目:
cd my-project
安装依赖,走你:
npm install
好了,现在依赖已经安装成功了,可以启动你的项目了:
npm run dev
=============================================================================================================================
windows下的安装
windows下的安装和linux下安装差不多,只是在创建新的项目的时候命令不同:
vue init webpack my-project
webpack是模板名称,my-project是你的项目名称。
好了,现在已经可以磨刀霍霍向你的项目了!
vue-cli安装的更多相关文章
- Vue技术点整理-Vue CLI安装详解
一,脚手架安装 Node 版本要求 Vue CLI 需要 Node.js +).你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本. 1,全局安装Vue CLI ...
- Vue Cli安装以及使用
因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...
- Vue CLI安装报错 npm ERR! Exit handler never called!
安装Vue CLI时报错: npm install –g vue-cli 试了四种办法 1.把全局安装-g放到后面 npm install @vue/cli –g 2.命令行输入 npm 缓存清理命令 ...
- vue cli 安装element-ui
1.安装elment-ui --save 参数:上线打包 MacBookPro:vue_test zhangxm$ npm install element-ui axios --save npm WA ...
- 解决@vue/cli 创建项目是安装chromedriver时失败的问题
最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...
- vue工具 - vue/cli@3.xx 安装使用流程
mac安装记得npm前边加sudo 安装脚手架,用于生成目录 npm install -g @vue/cli 安装用于编译单个的.vue文件 npm install -g @vue/cli-servi ...
- ubuntu下安装vue/cli提示No command 'vue' found
通过官方指令 npm install -g @vue/cli 安装vue脚手架提示: No command 'vue' found, did you mean: Command 'vpe' from ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
- Vue技术点整理-Vue CLI
Vue CLI 是一个基于 Vue.js 进行项目快速开发的脚手架 注:具体安装步骤可参考Vue CLI,默认安装的脚手架,是没有service.util等工具类的,以下主要描述如何在脚手架的基础上进 ...
- vue的安装配置与项目创建
1,安装vue必须先安装node.js. --------去官网安装node.js 因为npm依赖node.js环境,使用npm的时候需要安装node.js.安装node.js的时候npm会默认安装 ...
随机推荐
- MyBatis源码解析【2】构建项目
有了之前的准备,今天就要开始构建学习使用的项目了.废话不多说.开始吧. 首先我用IDEA构建了一个空的maven项目,然后加入了Mybatis的依赖. <dependencies> < ...
- 面向对象15.2String类-构造函数
public class String_Constructor { //快捷键小方法: Ctrl+d,删除整行,选中几行删除几行 public static void main(String[] ar ...
- 如何生成Azure SAS Token
在Azure PaaS服务密钥的安全性文章中,提到过客户端实际上发送的是Token,而不是密钥.那么Token是该如何生成呢? Azure相应服务的SDK其实都提供了或者内置了生成Token的方法,可 ...
- jfinal框架新手使用之路及开发心得
从接触jfinal这个框架到现在差不多也有一个的时间了,因为之前接触的都是像spring ,springMVC,mybatis,struts2,hibernate这种传统,大多数公司都在用的这种框架. ...
- 真实记录我入门学习Linux系统的经历
我本身来说并不是计算机专业的学生,因此今天来谈及这个话题,对大家来说,有了更多的客观公正性.对我而言,linux给我最大的财富,并不是编程能力提高了多少,而是视野的开阔.心态的转变和自学能力的提高.我 ...
- Phpcms 前台页面实现分页
phpcms开发就是模仿里面原有的方法进行扩展,前台要实现分页,就去找后台页面的分页实现. 如后台 扩展->后台操作日志,就有分页展示. 1.先去添加自己的分页方法(千万不要在原来的方法上修改, ...
- Java Swing intro
Java Swing intro 如果有Android app开发经验,快速上手Swing不是问题.UI方面有相似的地方. 简单的几行代码就能抛出一个框框,记录一下操作过程 1.先显示一个框框 Era ...
- (转)IBM MQ 创建以及常见问题集锦
背景:这篇文章还是很全面的,但是很杂乱 后面慢慢整理吧! 1 MQ 消息队列+发送队列+消息通道 接收通道名称与发送端的发送通道名称要一致,修改通道信息后要执行 start channle(chlna ...
- 【chrome】 chrome 开发者工具
1. 常用控制台工具 console.log console.info console.error console.warn console.assert console.count conso ...
- 【javascript】ajax的参数
1. 常用参数 url type: contentType: dataType: data: success: error 2. 特殊参数 context: 这个对象用于设置Ajax相关回调函数的上下 ...