etcpack 正在参加 2021 年度 OSC 中国开源项目评选,请投票支持!
etcpack 在 2021 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
2021 年度 OSC 中国开源项目评选 正在火热进行中,快来投票支持你喜欢的开源项目!
2021 年度 OSC 中国开源项目评选 >>> 中场回顾
etcpack 获得 2021 年度 OSC 中国开源项目评选「最佳人气项目」 !
授权协议 MIT
开发语言 JavaScript
操作系统 跨平台
软件类型 开源软件
开源组织
地区 国产
投 递 者 你好2007
适用人群 未知
收录时间 2021-12-21

软件简介

Etc Pack 是前端打包工具,和 webpack 类似,但基于浏览器的 ES6 模块实现,速度更快、更简单。

以一个无框架的前端项目为例,我们一般需要处理css或scss文件,js也可能需要转义。

那么,首先需要安装必要的node包:

npm install --save-dev etcpack @etcpack/style-loader @etcpack/scss-loader @etcpack/babel-loadel @babel/preset-env @babel/core

安装完毕以后,新建etcpack.common.js文件,进行配置:

当然,还需要配置babel的规则等,完整的例子你可以去查看例子项目:npm-downloads

开发的时候,直接使用


npm run dev

然后打开浏览器:127.0.0.1:20000,可以发现,我们并没有像webpack那样打成一个bundle,而是依据原始的结构:

这样的好处:1.打包的更快,2.调试更方便,不需要额外的map文件。

快速体验

如果你想快速试试,可以使用命令创建项目,Nefbl框架采用了此工具作为官方打包工具。

因此,首先,你需要安装cli工具:

npm install -g @nefbl/cli
 

然后,找个地方(比如桌面)执行生成命令:

nefbl create
 

根据提示依次输入项目名称、描述、选择打包工具等即可。

如上截图,请在选择打包工具的时候,选择etcpack这一项。

最后回车,即可得到一个空的基于etcpack打包的nefbl项目了(当然,打包别的框架或者无框架的项目也是可以的,只是需要修改对应的loader即可)。

版本

如果在使用的时候,发现文档中有的方法无法使用,可能是你的版本过低导致的,你可以点击此处查看版本日志。

建议

由于项目的建立是来自日常工作的需求,如果你希望下一版本提供新的功能,可以提issue告知我们!

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论

点击引领话题📣
暂无内容
发表了博客
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
发表了问答
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
0 评论
3 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部
返回顶部
顶部