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会默认安装 ...
随机推荐
- tp框架-----Model模型层
1.Model模型层是用来做什么的呢? 主要是用来做操作数据库访问的.也就说明TP框架自带了一种访问数据库的方式,使用的是Model模型. 2.Model模型怎样使用呢? 要使用Model模型层访问数 ...
- Chrome浏览器扩展开发系列之十九:扩展开发示例
翻译总结了这么多的官网内容,下面以一款博主开发的“沪深股票价格变化实时追踪提醒”软件为例,介绍Chrome浏览器扩展程序的开发,开发环境为Eclipse IDE+Chrome Browser. “沪深 ...
- C# 哈希表(Hashtable)用法笔记
一.什么是Hashtable? Hashtable 类代表了一系列基于键的哈希代码组织起来的键/值对.它使用键来访问集合中的元素. 当您使用键访问元素时,则使用哈希表,而且您可以识别一个有用的键值.哈 ...
- [NOIP2013/Codevs3287]货车运输-最小[大]生成树-树上倍增
Problem 树上倍增 题目大意 给出一个图,给出若干个点对u,v,求u,v的一条路径,该路径上最小的边权值最大. Solution 看到这个题第一反应是图论.. 然而,任意路径最小的边权值最大,如 ...
- 使用java语言编写窗口按钮
使用java语言编写窗口按钮 代码如下: package Day08; import java.awt.FlowLayout; import javax.swing.JButton;import ja ...
- 解决React Native unable to load script from assets index.android.bundle on windows
React Native运行的时候,经常碰到React Native unable to load script from assets index.android.bundle on windows ...
- 操作系统,银行家算法模拟实现(Windows 环境 C++)
计算机操作系统课设需要,写了两个下午的银行家算法(陷在bug里出不来耽误了很多时间),参考计算机操作系统(汤子瀛) 实现过程中不涉及难度较大的算法,仅根据银行家算法的思想和步骤进行实现.以下为详细步骤 ...
- 处理SFTP服务器上已离职用户,设置为登录禁用状态
测试用户禁用SQL select Enabled,LoginID from suusers where LoginID = 'yangwl' update suusers set Enabled=1 ...
- Angular02 将数据添加到组件中
准备:已经搭建好angular-cli环境.知道如何创建组件 一.将一个数据添加到组件中 1 创建一个新的组件 user-item 2 将组件添加到静态模板中 3 为组件添加属性,并利用构造器赋值 4 ...
- web项目-easyui-datagrid使用汇总
一,引言 工作的需要,做了3年的wpf--,又因为项目的需求,回归到web的开发. ■ 3 years ago,vue是我三年前没用过的玩意儿. ■ 3 years ago,bootstrap组件 ...