• 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.11

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

    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是你的项目名称。

    好了,现在已经可以磨刀霍霍向你的项目了!

  • 相关阅读:
    窗口显示于parent控件上
    DELPHI SOCKET 通信编程要点小结
    dxBarManagerToDxNavBar方法
    DLL直接返回对象
    海量数据库的查询优化及分页算法方案
    excel怎么只打印某页?excel怎么只打印某几页
    HTTP请求错误400、401、402、403、404、405、406、407、412、414、500、501、502解析
    excel中如何设置只打印第一页
    Navicat Premium 常用功能讲解
    laravel查询构造器DB还是ORM,这两者有什么区别,各该用在什么场景中
  • 原文地址:https://www.cnblogs.com/lishanlei/p/7399779.html
Copyright © 2020-2023  润新知