Parcel 是 Web 运用打包东西，适用于履历差别的开辟者。它应用多核处置惩罚供应了极快的速率，而且不须要任何设置。
特征
- 疾速打包：多核编译，以及文件体系缓存，纵然在从新启动以后也能疾速从新构建。
- 支撑JS、CSS、HTML、文件资本等，不须要装置任何插件。
- 在须要的时刻自动运用Babel、PostCSS和PostHTML自动转换模块，以至是node_modules。
- 零设置,代码拆分，运用动态import语句分开。
- 内置支撑模块热替代。
- 友爱的毛病纪录体验，语法凸起显现的代码帧有助于查明题目。
事情体式格局
parcel 将资本树转换为 bundle 树。很多别的的打包东西基本上都是基于 JS 资本，别的花样都是粘贴的-比方，默许情况下以字符串的情势内嵌到 JS 中。parcel 是文件范例无关的-它能够根据你希冀的体式格局与任何范例的资本一同事情，无需设置。
parcel 将一个进口点作为输入，能够是任何范例的：JS文件，HTML，CSS，image 等。在 parcel 中定义了种种资本范例，它们晓得怎样处置惩罚特定的资本范例。资本文件被剖析，它的依靠关联被提取，并转换成终究的编译情势。这建立了一个资本树。
一旦资本树被构建，资本就被放入一个bundle树中。为进口资本建立一个 bundle，并为动态导入的资本建立子 bundle，这回致使代码拆分的发作。当导入差别范例的资本的时刻就会建立子 bundle，比方假如你在 JavaScript 中导入 CSS 文件，它就会打包成对应 JavaScript 的兄弟 bundle。假如一个资本须要多个bundle，它会被打包到近来的配合先人，因而它不会被包括屡次。
在构建bundle树以后，每一个包都有特定的文件范例的包装器写入文件。打包器晓得怎样将每一个资本的代码合并到由浏览器加载的终究文件中。
入门
- 装置
yarn global add parcel-bundler或
npm install -g parcel-bundler Parcel 能够将任何范例的文件作为 entry point(进口点)，然则 HTML 或 JavaScript 文件是一个很好的最先。假如你运用相对路径将你的主 JavaScript 文件链接到 HTML 中，Parcel 也会为你处置惩罚，并将该援用替代为输出文件的URL。
<html> <body> <script src="./index.js"></script> </body> </html>console.log("hello world");Parcel 内置了一个开辟服务器，这会在你变动文件时自动重修你的运用程序，并支撑 模块热替代 ，以便你疾速开辟。你只需指定 进口文件 即可：
parcel index.html
webpack与parcel比较
Webpack 打包时候 = parse string n + transform n + parse to AST + compress
Parcel 打包时候 = parse to AST + transform * n + compress
Webpack 之所以偶然觉得很慢，是因为代码转译端赖 loader 举行字符串处置惩罚。比方一个 index.js 有可能要阅历 loaderA -> loaderB -> loaderC，这些 loader 完整不晓得彼此之间的存在，都是接过来一个字符串本身处置惩罚，然后再交给下一个。假如末了再 uglify 一下还要先 parse 为 AST（笼统语法树） 再紧缩，这一步也是比较耗时的。
因而，parcel 最少为我们供应了一个很好的思绪：多步转译 + 紧缩时，每一步都能够应用到已剖析事后的 AST，只需完成各自的 transform 即可。
运用parcel的上风
- 零设置，只须要将它指向运用程序进口点，就可以一般事情
- 构建疾速，具有文件体系缓存，能够保留每一个文件的编译效果
- parcel的转换事情在AST上，每一个文件只要一个剖析，多个转换以及一个代码天生
