近期梳理了一下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安装的更多相关文章

  1. Vue技术点整理-Vue CLI安装详解

     一,脚手架安装 Node 版本要求 Vue CLI 需要 Node.js +).你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本. 1,全局安装Vue CLI ...

  2. Vue Cli安装以及使用

      因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...

  3. Vue CLI安装报错 npm ERR! Exit handler never called!

    安装Vue CLI时报错: npm install –g vue-cli 试了四种办法 1.把全局安装-g放到后面 npm install @vue/cli –g 2.命令行输入 npm 缓存清理命令 ...

  4. vue cli 安装element-ui

    1.安装elment-ui --save 参数:上线打包 MacBookPro:vue_test zhangxm$ npm install element-ui axios --save npm WA ...

  5. 解决@vue/cli 创建项目是安装chromedriver时失败的问题

    最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...

  6. vue工具 - vue/cli@3.xx 安装使用流程

    mac安装记得npm前边加sudo 安装脚手架,用于生成目录 npm install -g @vue/cli 安装用于编译单个的.vue文件 npm install -g @vue/cli-servi ...

  7. ubuntu下安装vue/cli提示No command 'vue' found

    通过官方指令 npm install -g @vue/cli 安装vue脚手架提示: No command 'vue' found, did you mean: Command 'vpe' from ...

  8. Vue CLI 介绍安装

    https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...

  9. Vue技术点整理-Vue CLI

    Vue CLI 是一个基于 Vue.js 进行项目快速开发的脚手架 注:具体安装步骤可参考Vue CLI,默认安装的脚手架,是没有service.util等工具类的,以下主要描述如何在脚手架的基础上进 ...

  10. vue的安装配置与项目创建

    1,安装vue必须先安装node.js.  --------去官网安装node.js 因为npm依赖node.js环境,使用npm的时候需要安装node.js.安装node.js的时候npm会默认安装 ...

随机推荐

  1. OJ2237第k小数题解

    题目描述: 有n个数,请你找出第k小的数. 输入描述: 第一行有2个正整数n,k(n,k<=10^7)第二行有n个非负数ai(ai<=10^5) 输出描述: 输出第k小的数. 输入样例: ...

  2. Vue.js 基本功能了解

    一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...

  3. 1. MongoDB 安装和启动

    1. MongoDB是一个Document Database.A record in MongoDB is a document,MongoDB documents are similar to JS ...

  4. easyui-dialog里面的东西

    <div id="id_open" class="easyui-dialog" title="公司简介" style="wi ...

  5. CJOJ 2255 【NOIP2016】组合数问题 / Luogu 2822 组合数问题 (递推)

    CJOJ 2255 [NOIP2016]组合数问题 / Luogu 2822 组合数问题 (递推) Description 组合数\[C^m_n\]表示的是从n个物品中选出m个物品的方案数.举个例子, ...

  6. 同一个sql在不同的oracle中执行时间不一样

    最近因为某些原因不得不重新配置服务器的环境,当然就是一些简单的程序运行环境,包括tomcat .oracle和其他的一些.原本觉得还蛮简单的东西,但是当我部署完成后在运行程序的过程中发现了一些隐性因数 ...

  7. NOIP模拟:能源(二分答案)

    题目描述 小美为了拯救世界能源危机,她准备了 n 台蓄电池.一开始每台蓄电池有 ai 个单位的能量. 现在她想把 n 台蓄电池调整到能量相同.对于每台蓄电池可以给另一台蓄电池传递能量.但是会有能量损耗 ...

  8. (转)简单介绍java Enumeration

    简单介绍java Enumeration 分类: java技术备份 java数据结构objectstringclass存储 Enumeration接口  Enumeration接口本身不是一个数据结构 ...

  9. ML(1)--概念理解

    机器是如何模拟人来学习的? 人:  observations===>learning===>skill 人从出生开始经过大量的观察(也可能经过身边的的指导)进行学习然后得到相应的技能(比如 ...

  10. EF 数据库迁移(Migration)

    Update-Database -ConnectionStringName "MyConnectionString"