我爱编程

初探脚手架vue-cli

2018-03-28  本文已影响0人  派大曦

vue-cli是快速构建单页应用的脚手件,通过简单的命令行来搭建开发工程。ps:其中牵扯的内容有webpack,npm,nodejs等,orz新手劝退杀手

安装vue-cli

vue-cli是一个npm安装包,安装到node.js的全局运行目录下 ,即可在本机的任意目录下创建工程。

vue-cli的具体用法:

创建项目

一系列交互问题之后,开始初始化项目

vue-cli工程模板

主要学习webpack-simple和webpack(browserify也是从这两个模版的基础上移植的版本)。webpack-simple和webpack工程结构相似,但是这个两个版本暂时互相不兼容且依赖的版本不同。

webpack-simple

工程目录结构:

webpack-simple只配置了Babel和Vue的编辑器,src目录是存放Vue源代码的目录,5个模板构建出来的src目录都一样(webpack多了components目录用于存放公共组件)src目录的使用和文件命名很重要:

webpack

工程目录结构:

工程一下子复杂可很多(orz),但是这个模板结构非常合理,配置的工具也很丰富。

相比于webpack-simple多出了4个目录(dist目录做补充说明):

上一篇下一篇

猜你喜欢

热点阅读