在安装vue-cli时  先确保node.js已安装,要不然提示npm不是内部命令

node.js下载地址  https://nodejs.org/en/download/

安装完成后  在cmd命令行查看是否安装成功  node -v

然后安装vue-cli

    把npm换成cnpm,

   命令工具输入npm install -g cnpm --registry=https://registry.npm.taobao.org

学习vue组件化,安装vue-cli

查看是否安装成功

学习vue组件化,安装vue-cli

全局安装webpack:cnpm install webpack -g。使用webpack -v查看版本

学习vue组件化,安装vue-cli

注:如果webpack版本4以上,需要安装webpack-cli 依赖 

使用命令工具输入cnpm install webpack webpack-cli -g 如下图

学习vue组件化,安装vue-cli

安装vue-cli

      使用命令工具输入cnpm install vue-cli -g

学习vue组件化,安装vue-cli

学习vue组件化,安装vue-cli

②、

上面步骤安装完后,就可以利用vue-cli初始化vue项目

              在你想要安装项目的目录下输入vue init webpack projectname(projectname是你项目的名称),

             Project name:——项目名称

  Project description:——项目描述

  Author:——作者

  Vue build:——构建模式,一般默认选择第一种

   Install vue-router?:——是否安装引入vue-router,这里选是,vue-router是路由组件,后面构建项目会用到

Use ESLint to lint your code?:——这里强烈建议选no 否则你会非常痛苦,eslint的格式验证非常严格,多一个空格少一个空格都会报错,所以对于新手来说,一般不建议开启,会加大开发难度

Setup unit tests with Karma + Mocha 以及Setup e2e tests with Nightwatch这两个是测试,可以不用安装

选择上一张图片的NO,I will handle that myself

学习vue组件化,安装vue-cli

然后输入cd vue_demo(你项目名称)

然后再输入cnpm install

学习vue组件化,安装vue-cli

输入cnpm run dev

最后在网址打开http://127.0.0.1:8080/如下图

学习vue组件化,安装vue-cli

学习vue组件化,安装vue-cli

学习vue组件化,安装vue-cli

 

 

 

相关文章: