近期梳理了一下win和linux下安装vue项目,总结一下,希望对于看的人有帮助,废话不多说。

Linux下安装

因为我用的是deepin,所以再此就不演示了。首先电脑上已经安装好了node和npm了,如果没有安装的,后期需要npm包管理工具,如果还没有安装的,可以自己百度进行安装。

首先查看一下node和npm的版本,两个版本不能相差太大,如果相差太大可能在后期安装vue的时候会有一些不可预知的错误。

npm -v:查看npm版本

node -v:查看node版本

  1. lishanlei@lishanlei-pc:~$ npm -v
  2. 5.3.0
  1. lishanlei@lishanlei-pc:~$ node -v
  2. v8.4.0

  

注意,win下和linux下其最新版本可能不同,不必纠结于这些。

升级npm到最新版本:

  1. npm install -g npm

如果想gengxin到指定版本:

  1. npm -g install npm@2.9.1 //后面的是版本。

升级node版本:

清除npm cache:

  1. sudo npm cache clean -f

安装n模块:

  1. sudo npm install -g n

指定升级到受欢迎的版本:

  1. sudo n 0.8.

当然,你也可以升级到最新版本:

  1. sudo n stable

OK,查看当前版本是否升级成功。

成功之后我们开始安装vue

在安装时用到npm包管理工具,但是npm是外国的,老牛拉破车一般的速度,建议使用淘宝镜像用cnpm替换npm,特别简单:

  1. npm install -g cnpm --registry=https://registry.npm.taobao.org
  1. 这样就将本地的npm替换成了cnpm,如果想了解更过,可以访问npm.taobao.org,在此不做叙述。
    安装vue:
  1. cnpm install vue
  1. 安装完后查看vue是否安装:
  1. lishanlei@lishanlei-pc:~$ vue
  2.  
  3. Usage: vue <command> [options]
  4.  
  5. Options:
  6.  
  7. -V, --version output the version number
  8. -h, --help output usage information
  9.  
  10. Commands:
  11.  
  12. init generate a new project from a template
  13. list list available official templates
  14. build prototype a new project
  15. help [cmd] display help for [cmd]

OK,安装成功,下来安装vue的管理工具vue-cli:

  1. cnpm install --global vue-cli

好了,安装成功,过程可能有点长,耐心等待。

下来我们就可以创建一个基于 webpack 模板的新项目了:

  1. vue init webpack my-project

my-project是你的项目名称,在安装过程中有很多选项,根据自己的需求进行选择。

进入新项目:

  1. cd my-project

安装依赖,走你:

  1. npm install

好了,现在依赖已经安装成功了,可以启动你的项目了:

  1. npm run dev

=============================================================================================================================

windows下的安装

windows下的安装和linux下安装差不多,只是在创建新的项目的时候命令不同:

  1. 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. Python数据分析之路(一)查询和统计

    0. 如何入门数据分析 关注沙漠之鹰的同学一定看过沙漠君写得很多篇数据分析文章,比如分析房价,车价,预测机动车摇号这些话题.其实文章中所有的分析都使用了Python和它非常强大的数据分析库Pandas ...

  2. ubuntu(linux)新装系统恢复备份后无法进入系统问题的解决

    1. 引子: 可以跳过直接看3.~5. 我们可能会遇到这样的状况,从ubuntu转到别的系统,兜兜转转又回到了ubuntu. 比如说: Fedora升级后一大堆BUG,与java有关的软件渲染都糟糕的 ...

  3. java Semaphore的介绍和使用

    一个计数信号量.从概念上讲,信号量维护了一个许可集.如有必要,在许可可用前会阻塞每一个 acquire(),然后再获取该许可.每个 release() 添加一个许可,从而可能释放一个正在阻塞的获取者. ...

  4. Python爬虫从入门到放弃(十七)之 Scrapy框架中Download Middleware用法

    这篇文章中写了常用的下载中间件的用法和例子.Downloader Middleware处理的过程主要在调度器发送requests请求的时候以及网页将response结果返回给spiders的时候,所以 ...

  5. centos/linux alternatives与update-alternatives详解与软件版本切换

    update-alternatives是linux系统中专门维护系统命令链接符的工具,通过它可以很方便的设置系统默认使用哪个命令.哪个软件版本,比如,我们在系统中同时安装了open jdk和sun j ...

  6. CSS边框(圆角、阴影、背景图片)

    1.圆角  border-radius是向元素添加圆角边框. 使用方法: border-radius:10px; /* 所有角都使用半径为10px的圆角 */ border-radius: 5px 4 ...

  7. Java调度实现

    根据自己在项目中用到的调度,简单说说:(如有不正确的地方,请留言...) Java调度:他是用来解决访问时间慢的手段. 通俗的讲就是为需要的数据(你需要展示的数据)建立一张中间表存放,提前把数据读出来 ...

  8. *更新*无需root,一条命令强制全屏模式

    未root的系统,必须通过pc端运行adb命令进行设置,因此请开启开发者选项中的adb调试模式,用usb连接电脑和手机,运行下面的代码强制开启全屏模式,立即生效:全屏沉浸: adb shell set ...

  9. 【Log4j】分包,分等级记录日志信息

    在开发中我们经常会将不同包下的日志信息在不同的地方输出,以便于以后出问题能够直接在对应的文件中找到对应的信息! 例如:在spring+SpringMVC+mybatis的框架中,我们经常会将sprin ...

  10. ionic时间插件ion-datetime-picker

    https://github.com/katemihalikova/ion-datetime-picker