前言
一些前提
- 标题里的 extract-text-plugin 实际上是 extract-text-webpack-plugin,标题太长了想缩短一些;
- 想描述的
extract-text-webpack-plugin
意外搞乱内容,debug 后感觉是一个特别场景里导致的问题,并不是很普遍,或者单纯就是我没搞对配置 🤦🏻♂️,笔记里面会描述。
最近做了一批 webpack 导出到 UMD 格式的项目,不管是自己的测试还是公司里的项目;首先 webpack 做导出并不是什么稀奇事,webpack 里面用 multiple entry 分别导出 .js
和 .scss
文件也不是什么稀奇事,在 webpack 里使用 extract-text-webpack-plugin
来把 .scss
到 css
处理结果单独导出成为独立样式文件更不是什么稀奇事。
但是结合到一起就可能导致一些不该出现的问题,比如就是把 webpack 的输出 UMD 搞乱。
这里单纯地做记录,正确和错误的区别是取决于外部通过 require.js 引入是否能得到结果来判定。webpack 那块 output 的内容,不太确定到底是错在哪里。
问题重现
目录结构和内容
JavaScript 和 CSS 内容
❌ 导致问题发生的 webpack 配置和文件引入方式
主要就是 webpack 入口设置 entry
那里。
Webpack 输出结果(有区别的部分)
✅ 不会出现问题的 webpack 配置和文件引入方式
webpack 输出结果(有区别的部分)
备份
留一份完整的配置和输出结果,作为 reference:
你们好,
2018 年初把小站从 Jekyll 迁移到 Hugo 的过程中,删除了评论区放的 Disqus 插件,考虑有二:首先无论评论、还是对笔记内容的进一步讨论,读者们更喜欢通过邮件、或者 Twitter 私信的方式来沟通;其次一年多以来
Disqus 后台能看到几乎都是垃圾留言(spam),所以这里直接贴一下邮件、以及 Twitter 账户 地址。
技术发展迭代很快,所以这些笔记内容也有类似新闻的时效性,不免有过时、或者错误的地方,欢迎指正 ^_^。
BEST
Lien(A.K.A 胡椒)
技术发展迭代很快,所以这些笔记内容也有类似新闻的时效性,不免有过时、或者错误的地方,欢迎指正 ^_^。
BEST
Lien(A.K.A 胡椒)