windows下安装vue-cli

vue-cli全称：Vue-Command Line Interface，即vue命令行接口

Vue-CLI是vue官方提供的脚手架工具

默认已经帮我们搭建好了一套利用webpack管理vue的项目结构

安装Vue-CLI

安装脚手架工具，在cmd中输入如下命令：

npm install -g @vue/cli

注释：需要先安装nodejs

等待安装完毕后，输入如下命令测试是否安装成功

vue --version

如果安装成功，上述命令将显示vue-cli版本号

创建一个vue项目

通过脚手架创建项目，输入如下命令

vue create project-name

此时需要选择一些配置，输入enter，默认选择vue2x然后下一步即可

你需要注意，它默认安装在当前目录下，当然你可以先切换当前所在目录。

创建项目完毕后，进入该目录

cd project-name

接着，使用npm运行

npm run serve

此时，就可以直接在浏览器访问项目了，一般是localhost:8080

如果要退出，连续两次按下ctrl+c即可终止运行。

一般来说，你只需要关注以下2个目录

• public 目录，存储静态文件或不被webpack支持的第三方库
• src 目录，存放vue模板文件

在使用更多vue-cli时，你可以先学习webpack更多知识，或参考vuejs.org

例如，你在执行npm run build时，生成的文件可能404，按照vue官网提示中，在项目根目录中新建一个vue.config.js，然后写上

module.exports = {
  publicPath: './'
}

此时，再使用build即可打包出正确的静态页面。