超好用的前端构建工具Parcel

前端的发展可谓是日新月异,而前端的自动化构建这方面也一直是在快速的发展。

使用自动化工具为前端的开发工作带来的方便自然不言而喻,相信每一个前端都深有体会。

自从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这个自动化构建工具现在也存在了一个问题就是社区资源不够完善。

希望这个神器可以发展的越来越好。

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

推荐阅读更多精彩内容

  • 作为奇舞团的一个小小程序媛,每天都在不断地接受新知识,PostCSS刚学完,PostHTML又出来了。刚研究明白R...
    美洋洋_4f15阅读 7,402评论 0 2
  • 最近在学习 Webpack,网上大多数入门教程都是基于 Webpack 1.x 版本的,我学习 Webpack 的...
    My_Oh_My阅读 12,517评论 40 247
  • 在现在的前端开发中,前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始...
    Charlot阅读 10,833评论 1 32
  • 无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅,特此分享以备自己日后查看,也希望更多的人看到...
    小小字符阅读 12,543评论 7 35
  • 前两天,班长发了个活动号召贴,幸运地得到最后一个报名机会,得以参加今天的品酒话人生主题聚会。 Get到关于酒的种种...
    平静de小女巫阅读 1,488评论 0 0