有熟悉 webpack 的大神么?求思路

2021-07-10 16:59:01 +08:00
 ElmerZhang

背景:有个网站项目,其中有些文档内容,以 md 形式放在固定一个文件夹内。

现在希望每次网站构建的时候,能自动扫描文件夹内的文件,根据文件名及内容来生成一个目录索引,比如:

const articleList = [
  {
    filename: 'xxxx',
    title: 'xxxx',
    content: 'xxxx',
  },
]

项目是用的 umi 框架,使用 webpack 5 来打包的。

目前初步想法是通过给 webpack 写 loader 或者 plugin 的方式来实现。

但是没研究清楚具体该用 loader 还是 plugin,如果用 plugin 的话,该在哪里做 hook ?生成的内容最好是仅存在于构建阶段或者结果中。

求大神指点。

2496 次点击
所在节点    程序员
9 条回复
SoloCompany
2021-07-10 17:22:58 +08:00
那要看你的目标是什么
loader 是用来生产 module 的
plugin 才可以构建 asset
g1f9
2021-07-10 18:01:44 +08:00
如果想以字符串的形式导入,用 raw-loader 就行了,require.context 可以解决你扫描的问题
DiamondYuan
2021-07-10 18:07:02 +08:00
如果是 umi 的项目,可以写一个简单的 umi 插件。
在构建时使用 nodejs 读取文件夹,输出到产物里。
JerryY
2021-07-10 20:01:56 +08:00
如果我没理解错你的意思,你这个场景应该是用 plugin 来弄。hook 的时机你这个例子不用太过于讲究,因为只是读取项目的文件,不依赖于项目构建 /编译某一阶段的某些信息。生成的内容也是都可以的,最后可以 emit 一个 json 文件。
EPr2hh6LADQWqRVH
2021-07-10 20:32:39 +08:00
你这东西和 webpack 无关,自己写个脚本干这件事
非得弄成 webpack 插件下次这玩意升级的时候有你好受
ElmerZhang
2021-07-10 22:17:44 +08:00
感谢楼上各位,有一些思路了,我再研究研究
FallenMax
2021-07-10 23:49:42 +08:00
推荐写脚本,不要依赖 webpack 专门特性
godblessumilk
2021-07-11 12:19:43 +08:00
同上,建议用 shell 脚本去做,因为 shell 脚本的 api 由操作系统提供,万年不变。前端的工程化工具目前没有统一的,一年一个大版本是常事,webpack 的底层依赖也是 node,node 已经被创始人放弃了,虽然生态很繁荣
towry
2021-07-11 17:00:38 +08:00
我更相信 nodejs 比他的网站存活的长久

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/788728

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX