捆绑器的任务是捆绑你的应用程序资产,如HTML、Javascript和CSS,以及依赖和输出到文件中。 我们有很多Web应用程序流行的捆绑器,如webpack、Browserify和rollup吗,那么为什么引入parcelJs呢?使用webpack,我们有很多配置和复杂的设置。与现有的捆绑器相比,Parcel的配置为零,性能也很好。
Parcel内置的功能
- 快速的性能,因为它使用多核处理器和缓存支持并行运行任务
- 对javascript、CSS、HTML和图像、其他UI资产的综合内置支持。不需要额外的插件
- 零或最小的配置
- 详细的错误记录机制
- 热门模块替换。
设置/安装ParcelJS
对于任何网络应用,我们有两种安装方式
也可以使用Yarn
yarn global add parcel-bundler
使用NPM工具
npm install -g parcel-bundler
要检查ParcelJs的安装,请执行以下命令
B:\Workspace\parcel>parcel --version
1.9.7
要创建一个空项目,首先,我们需要在你的项目主目录下有 package.json。要创建它,使用yarn或npm命令来生成它。
yarn init -y
npm init -y
这将生成package.json文件,如下所示
{
"name": "parcel",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
你需要为parcel命令提供入口点,为此创建一个index.html文件,如下所示
index.html
<html>
<body>
<script src="./index.js"></script>
</body>
</html>
index.js
console.log('Parcel Testing application')
运行这段代码需要开发服务器,Parcel有一个内置的开发服务器。
parcel index.html
Server running at http://localhost:1234
Built in 1.11S
parcel命令的基本语法
parcel {options} {Commands}