美文网首页
Vue-cli安装

Vue-cli安装

作者: Cynicism_ym | 来源:发表于2018-05-11 00:55 被阅读0次

    一、前期准备:

                1、安装node.js

                        从node.js官网下载并安装node,一路“下一步”(傻瓜式安装)。安装完成之后,打开命令行工具(win+r,然后输入cmd),输入 node -v,如下图,如果出现相应的版本号,则说明安装成功。(这里需要说明下,因为在官网下载安装node.js后,就已经自带npm(包管理工具)了,另需要注意的是npm的版本最好是3.x.x以上,以免对后续产生影响。)

            2、 安装淘宝镜像(cnpm)

                          打开命令行工具,把这个(npm install -g cnpm --registry= https://registry.npm.taobao.org)复制(这里要手动复制就是用鼠标右键那个,具体为啥不多解释),安装这里是因为我们用的npm的服务器是外国,有的时候我们安装“依赖”的时候很很慢很慢超级慢,所以就用这个cnpm来安装我们说需要的“依赖”。安装完成之后输入 cnpm -v,

            3、安装webpack

                        打开命令行工具输入:npm install webpack -g,安装完成之后输入 webpack -v。 4.安装vue-cli脚手架构建工具,打开命令行工具输入:npm install vue-cli -g,安装完成之后输入 vue -V(注意这里是大写的“V”),如下图,如果出现相应的版本号,则说明安装成功。

    二、构建Vue-cli项目:

                1、硬盘建文件夹放工程用,这里有两种方式指定到相关目录:

    ①cd 目录路径;      ②如果以安装git的,在相关目录右键选择Git Bash Here;

                2、安装vue脚手架:

    vue init webpack exprice —————————“exprice” 是随便起的项目名“不能用中文!”;

    ? Project name (exprice) —————————项目名称是否为exprice;

    —————— Project name exprice

    ? Project description (A Vue.js project) ————————项目描述;

    —————— Project description A Vue.js project

    ? Author Datura ———————————————— 项目创建者

    —————— Author Datura

    ? Vue build (Use arrow keys)——————————构建vue

    —————— Vue build standalone

    ? Install vue-router? (Y/n) ——是否安装Vue路由,也就是以后是spa(但页面应用需要的模块)

    —————— Install vue-router? Yes

    ? Use ESLint to lint your code? (Y/n) n —————是否启用eslint检测规则,(个人建议选no)

    —————— Use ESLint to lint your code? No

    ? Setup unit tests with Karma + Mocha? (Y/n)————是否使用 Karma + Mocha单元测试

    —————— Setup unit tests with Karma + Mocha? Yes

    ? Setup e2e tests with Nightwatch? (Y/n)————————是否使用e2e进行检测

    —————— Setup e2e tests with Nightwatch? Yes

    vue-cli · Generated "exprice".——————————已创建项目名为“exprice”的vue脚手架

    To get started: --------------------- 这里说明如何启动这个服务

                cd exprice—————— 跳转到项目下

                npm run dev——————运行项目

    相关文章

      网友评论

          本文标题:Vue-cli安装

          本文链接:https://www.haomeiwen.com/subject/gzrxdftx.html