功能还比较简陋,但是打包思路很有意思,可以使用 SASS 、ES6 等功能,比较好的解决了路径问题。
比较适合开发单页面的活动专题时使用。
特点
- 非常易用
- 打包速度快
- 插件安装即可,Parcel 会自动加载
目前缺点:
- 打包路径可定制性差
- HMR 功能目前问题比较多
- Cache 功能能问题比较多
- 当有问题时请
rm -rf .cache dist build
,然后重新运行构建 - 由于 SASS @import 时存在 url 的相对路径无法正确解析问题。所以有如下策略
- 使用 JavaScript 的
import
引入components
和node_modules
里的样式模块 - 使用 SASS @import 引入的文件包含相对路径的图片时,请保证被引入的 SASS 文件和原文件在同一目录
- 如果 SASS @import 引入的文件想使用图片,请使用绝对路径
定义 Assets
- 资源类型
- 解析资源
- 提取依赖
- Transform
- Code Generate
处理流程
- Entry
- Parse + Deps + Transform
- Assets Tree
- Bundles Tree
- Packagers
- Final Bundle
使用方法
- npm i (安装所需依赖)
- npm start
- npm run build