前端的发展可谓是日新月异,而前端的自动化构建这方面也一直是在快速的发展。
使用自动化工具为前端的开发工作带来的方便自然不言而喻,相信每一个前端都深有体会。
自从node出现之后,前端的自动化工具就层出不穷,单说我有使用的就有gulp,webpack。
但是这些都避免不了繁琐的配置,比如在vue-cli中的脚手架中,单单webpack的配置都有不下8个文件,代码量也是多的一笔。
如果在开发一个小项目的时候parcel可能是一个很不错的选择。零配置的开箱即用。
npm install -g parcel-bundler
全局安装之后就可以使用。
在项目目录下运行parcel index.html (你的入口文件)
parcel就可以在一个端口启动一个服务,默认为1234端口,parcel index.html -p 8080可以修改启动的端口号。
完全不需要配置,即可支持ES6的import 语法 commonjs的require语法。代码的热加载。
在代码热加载这个地方我遇到了一个小小的坑。
通过parcel启动项目之后,我更改代码浏览器页面没有任何变化。摸索了好久才发现问题所在。
因为我的html页面中没有引入外部的js文件。所以代码没有实现热加载。引入了一个空的js文件之后就可以热加载了。这具体是什么原因造成的我暂时也没有找到答案。
不过parcel这个自动化构建工具现在也存在了一个问题就是社区资源不够完善。
希望这个神器可以发展的越来越好。