使用vue2构建管理后台


国内环境, 建议先安装 cnpm ^1

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
  1. 第一种方式:

    初始化环境,生成package.json

    $ mkdir vue2-admin
    $ cd vue2-admin
    $ npm init

    安装vue2

    $ cnpm install vue --save
    ✔ Installed 1 packages
    ✔ Linked 0 latest versions
    ✔ Run 0 scripts
    ✔ All packages installed (1 packages installed from npm registry, used 5s, speed 101.32kB/s, json 1(10.35kB), tarball 476.16kB)

    安装axios, 用于ajax交互

    $ cnpm install axios --save
    ✔ Installed 1 packages
    ✔ Linked 3 latest versions
    ✔ Run 0 scripts
    ✔ All packages installed (4 packages installed from npm registry, used 5s, speed 28.3kB/s, json 4(42.27kB), tarball 96.79kB)
  2. 第二种方式

    使用vue-cli安装工具初始化项目 ^2

    $ vue init webpack vue2-admin
    
    ? Target directory exists. Continue? Yes
    [ ... ]
    ? Project name vue2-admin
    ? Project description A Vue.js project
    ? Author itaken <regelhh@gmail.com>
    ? Vue build standalone
    ? Install vue-router? Yes
    ? Use ESLint to lint your code? Yes
    ? Pick an ESLint preset Standard
    ? Setup unit tests with Karma + Mocha? Yes
    ? Setup e2e tests with Nightwatch? No
      ...
    $ cd vue2-admin
    $ cnpm install[40/60] Installing ms@0.7.1platform unsupported babel-loader@6.4.0 › webpack@2.2.1 › watchpack@1.3.1 › chokidar@1.6.1 ›
      ...

    ESLint是js检验工具, 可不安装, Karma + Mocha 是单元测试工具, Nightwatch 也是一种测试工具, 可以不安装.

  3. 运行项目

    $ npm run dev

    vue 项目


参考文档


Author: Itaken
Reprint policy: All articles in this blog are used except for special statements CC BY 4.0 reprint polocy. If reproduced, please indicate source Itaken !
  TOC目录