01.vue-cli 快速搭建vue项目脚手架

由于我们搭建一个基于Webpack的项目,需要先进行webpack配置,手动配置太繁琐

vue-cli就是一个帮助我们快速构建基于Webpack打包构建项目的工具,通过vue-cli可以快速的生成基于webpack的项目,意味着大量的配置不用你自己手动实现,因为这个工具已经为你生成好了

使用过程

-1. 下载安装:最好看官网:https://cli.vuejs.org/zh/guide/installation.html
指令npm install -g @vue/cli

  • 2 创建新项目命令:vue create 项目名称

网页:https://cli.vuejs.org/zh/guide/creating-a-project.html

  • 3.预设选择项:

通过箭头切换选项,通过空格来确认选择,通过enter来确认到下一步


xi.png

我们选择默认项的话,该项目自动即可创建完成,但是它没有less的加载器,我们要自己在node_modules中下载less加载器,但是配置就不用你写了,它会自动写入.

如果我们选择手动设置的话,还要经历下列一系列的选项:


001.png

002.png

003.png

004.png

005.png

006.png

这一系列选择完毕后,我们即可配置完成

创建项目完毕后我们就会出现该文件:


xixi.png
  • 入口文件:


    si6.png
  • 模板文件(html):


    xixixixi.png

注意:新版脚手架中我们已经看不到webpack.config.js文件了

  • 运行项目:npm run serve
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容