optimization.addPolyfill 支持指定 polyfill 方式 #126

surmon-china · 2020-07-10T18:16:24Z

optimization.addPolyfill 支持传入字符串值指定 polyfill 方式：

默认值：global，即：使用基于 @babel/polyfill 的 polyfill，polyfill 会被作为独立的包被页面前置引用，会污染全局内置对象，适合宿主应用；
可选值：runtime，使用 @babel/plugin-transform-runtime 实现的 polyfill，生成辅助函数以替换特定方法，不会污染全局命名空间，适用于工具类库（但目前使用 corejs2，所以还不支持实例方法，如：[].includes）

更新为 corejs@3 了，但没有测试

surmon-china · 2020-07-13T06:35:12Z

@huangbinjie @Luncher @nighca @lzfee0227

代码先改完了，@huangbinjie 有空的话测试下啊

lzfee0227

看不懂
@nighca @Luncher

lzfee0227 · 2020-07-13T06:23:12Z

package.json

@@ -32,7 +32,7 @@
 "image-webpack-loader": "^4.6.0",
 "immutability-helper": "^2.5.0",
 "jest-cli": "^24.7.1",
- "less": "^3.9.0",
+ "less": "3.9.0",


可能是我错误的测试得出了错误的结论。

现在看来，是 less-loader v6.x API 变了，options 变成了 lessOptions；
再看来，less 可以升级为最新，应该没问题

lzfee0227 · 2020-07-13T06:33:33Z

lib/constants/polyfill.js

+ * @author Surmon <[email protected]>
+ */
+
+exports.PolyfillType = {


首字母应该大写吗

我把这东西定义为常量，所以就大驼峰了。

这边没有“常量大驼峰”的习惯..毕竟不是 TS enum

lzfee0227 · 2020-07-13T06:34:08Z

build-config.md

- 是否开启自动 polyfill 功能，开启后会根据 `targets.browsers` 参数自动打包对应的 polyfill，并在作为独立的包被页面前置引用，`true` 启用，`false` 禁用
+ 是否开启自动 polyfill 功能，开启后会根据 `targets.browsers` 参数自动实现对应的 polyfill；`true` 启用，`false` 禁用
+
+- **`optimization.polyfillType`**


这个是否要/能跟 addPolyfill merge

看各位大佬的意思

建议合并，builder 的配置目前习惯对较复杂的配置项，保持相同项、支持不同类型的值；如 transforms.xxx、optimizations.transformDeps

lib/webpack-config/addons/add-transform.js

package.json

huangbinjie · 2020-07-13T09:20:28Z

package.json

 "semver": "^5.5.0",
 "style-loader": "^0.19.0",
- "stylus": "^0.54.5",
+ "stylus": "^0.54.7",


NIP：这玩意是不是也可以去掉= =，和 sass 去掉的目的一样

这要问 @nighca

@huangbinjie 这个东西不像 sass 那么坑，可以先不动它..

build-config.md

Luncher · 2020-07-13T16:03:07Z

preset-configs/default.json

@@ -45,6 +45,7 @@
 },
 "optimization": {
 "addPolyfill": true,
+ "polyfillType": "default",


这个字段如果跟 addPolyfill 合并起来会不会好些？

看各位大佬的意思

nighca

除了配置的 API，我这没问题；插件的配置与使用相关 @Luncher @huangbinjie 更熟悉，麻烦把个关~

surmon-china · 2020-07-21T16:20:21Z

除了配置的 API，我这没问题；插件的配置与使用相关 @Luncher @huangbinjie 更熟悉，麻烦把个关~

建议合并为："polyfill": "<string>"，注意，是 替换 "addPolyfill" 为 "polyfill"，类型是 boolean 替换为 string

可选值为：

value	desc
`"none"`	不开启 `polyfill`
`"default"`	开启基于 `@babel/polyfill` 的 `polyfill`
`"runtime"`	开启基于 `@babel/plugin-transform-runtime` 的 `polyfill`

各位大佬看怎么样 @nighca @lzfee0227 @Luncher @huangbinjie

surmon-china · 2020-07-21T16:21:08Z

build-config.md

+
+ 使用什么形式的 polyfill
+
+ - 默认值：`default`，即：使用基于 `useBuiltIns` 的 polyfill，polyfill 会被作为独立的包被页面前置引用，会污染全局内置对象，适合大型应用；


Suggested change

- 默认值：`default`，即：使用基于 `useBuiltIns` 的 polyfill，polyfill 会被作为独立的包被页面前置引用，会污染全局内置对象，适合大型应用；

- 默认值：`default`，即：使用基于 `useBuiltIns` 的 polyfill，polyfill 会被作为独立的包被页面前置引用，会污染全局内置对象，适合宿主应用；

适合普通项目？宿主的话，感觉一般是表示有人寄生，被寄生一方才叫宿主

nighca · 2020-07-22T01:43:34Z

替换 "addPolyfill" 为 "polyfill"，类型是 boolean 替换为 string

@surmon-china 替换字段名是为了保持老字段的兼容吗？

是的话为啥不考虑合并字段，让这个字段支持 boolean 或 string（如前所述，这个是有先例的做法）？不是的话，为这个做不兼容变更不值得

我的粗略想法是：

optimization.addPolyfill

value	desc
`false`	不开启 polyfill
`true`	开启 polyfill，使用默认 type（同 `default`）
`"default"`	开启基于 `@babel/polyfill` 的 `polyfill`
`"runtime"`	开启基于 `@babel/plugin-transform-runtime` 的 `polyfill`

（如果 default 能换个名字就更好了...）

nighca · 2020-07-22T09:15:58Z

lib/webpack-config/addons/add-polyfill.js

@@ -39,7 +40,10 @@ module.exports = (webpackConfig, srcDir, srcPath, { addPolyfill }) => {
 [
 path.join('./', srcDir, '/') + mockFile
 ]: (
- `require('@babel/polyfill')`
+ `


这个的来源是？我看按这边的意思是

import "core-js/stable"; import "regenerator-runtime/runtime";

或

require("core-js"); require("regenerator-runtime/runtime");

这边 import / require & core-js / core-js/stable 有说法吗

本地验证一下行为吧

参考信息：

原有的 @babel/polyfill 源码没有啥参考价值，因为和它文档说的也对不上

babel 是靠这几段代码来确定 如何替换指定的 polyfill 语句的（按顺序来）

isBabelPolyfillSource

isCoreJSSource

shouldReplace

corejsEntries 一个生成器，会生成一个 json（入口与替换规则的映射）供 babel 这样的工具来选择，源码中没有 json，~~我把 json 贴到下一个 comment~~ json 太大我就不贴了，看 diff 吧

所以，可以看出，require('core-js') 是比 require('core-js/stable') 替换的东西要多的，前者大概 335 条规则，后者 216 条，diff 结果在这里

所以区别基本上就是：

core-js: 使用 core-js 全部功能打补丁。

core-js/stable: 仅仅使用稳定的 core-js 功能 - ES 和 web 标准。(This folder contains entry points for all stable core-js features with dependencies. It's the recommended way for usage only required features. )

OK 👍 本地验证也符合预期就行

本地还没验证... 等我再验证下，先不要管这个 PR

https:/babel/babel/blob/main/packages/babel-plugin-transform-runtime/src/index.js#L171
https:/Front-End-Engineering-Cloud/builder/pull/126/files#diff-ab761998e856a018ddd09e81cf96b1feR55
@nighca 这样？

build-config.md

+ | value | desc |
+ | ------------- | ------------- |
+ | `false` | 不开启 `polyfill` |
+ | `true` | 开启 `polyfill`，使用 `global` 方式的 `polyfill` |


nighca

🎎

huangbinjie

lgtm

lzfee0227 · 2020-07-23T06:41:54Z

lib/constants/polyfill.js

+}
+exports.isRuntimePolyfill = type => {


lzfee0227 · 2020-07-23T06:45:25Z

npm-shrinkwrap.json

@@ -8398,8 +9722,8 @@
 },
 "less": {
 "version": "3.9.0",
- "resolved": "https://registry.npmjs.org/less/-/less-3.9.0.tgz",
- "integrity": "sha512-31CmtPEZraNUtuUREYjSqRkeETFdyEHSEPAGq4erDlUXtda7pzNmctdljdIagSb589d/qXGWiiP31R5JVf+v0w==",
+ "resolved": "https://r.cnpmjs.org/less/download/less-3.9.0.tgz",


为什么就这几个货换 cnpm 了
一点都不纯粹

huangbinjie · 2020-07-23T07:31:26Z

optimization.addPolyfill

@nighca @surmon-china 你看能不能这么改，支持 object，以支持更多的配置

value	desc
`false`	不开启 polyfill
`true`	开启 polyfill，使用默认 type（同 `default`）
`object`	`{ polyfillTzype?: 'default', 'runtime', proposal?: boolean }`

nighca · 2020-07-24T01:52:14Z

optimization.addPolyfill

你看能不能这么改，支持 object，以支持更多的配置

@huangbinjie 我不倾向现在改，主要是考虑：

目前没看到对“是否支持 proposals”定制的需求（builder 原则上是能不给定制的就不暴露定制能力，否则就等于再造了个 webpack，没啥意义）
真的需要对 proposals 支持程度进行定制的话，简单的 true / false 又大概率不能满足需求（至少要能指定支持到 stage-n吧？），那样就比较复杂了
现在这么做了（boolean / string），不妨碍以后在真的需要的时候再去支持 object 格式的配置，代价是不大的

surmon-china · 2020-07-24T08:38:41Z

已在本地测试，true false "global" "runtime" 均符合预期

nighca

🤸

v1.18.0

040270d

surmon-china mentioned this pull request Jul 10, 2020

remove babel-preset polyfill configure #122

Closed

surmon-china added 2 commits July 11, 2020 02:55

fix: 错误的引用

8864132

up deeps & corejs@3

ec71072

This was referenced Jul 10, 2020

polyfills 的一些问题 #123

Closed

更新 autoprefixer #110

Closed

surmon-china added 3 commits July 11, 2020 03:05

fix: less javascriptEnabled deprecated

d819666

fix: 垃圾 less

8f011a8

fix: less

85b453b

lzfee0227 reviewed Jul 13, 2020

View reviewed changes

huangbinjie reviewed Jul 13, 2020

View reviewed changes

lib/webpack-config/addons/add-transform.js Outdated Show resolved Hide resolved

huangbinjie reviewed Jul 13, 2020

View reviewed changes

package.json Show resolved Hide resolved

huangbinjie reviewed Jul 13, 2020

View reviewed changes

package.json Show resolved Hide resolved

huangbinjie reviewed Jul 13, 2020

View reviewed changes

build-config.md Outdated Show resolved Hide resolved

Luncher reviewed Jul 13, 2020

View reviewed changes

nighca reviewed Jul 21, 2020

View reviewed changes

surmon-china commented Jul 21, 2020

View reviewed changes

surmon-china added 4 commits July 22, 2020 16:41

UP

3e43364

Merge branch 'master' into master

66541b3

remove yarn.lock

706f7cb

Merge branch 'master' of github.com:surmon-china/builder

c15c87d

surmon-china requested review from nighca and huangbinjie July 22, 2020 08:50

nighca reviewed Jul 22, 2020

View reviewed changes

doc: update

eba2892

nighca approved these changes Jul 23, 2020

View reviewed changes

huangbinjie approved these changes Jul 23, 2020

View reviewed changes

lzfee0227 reviewed Jul 23, 2020

View reviewed changes

lib/constants/polyfill.js Outdated

Comment on lines 13 to 14

}

exports.isRuntimePolyfill = type => {

Copy link

lzfee0227 Jul 23, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

\n

lzfee0227 reviewed Jul 23, 2020

View reviewed changes

surmon-china added 2 commits July 24, 2020 14:25

add 'proposalEnabled'

3e4b907

proposalEnabled -> proposalsEnabled

aa4158f

chore: version

c4baa89

surmon-china force-pushed the master branch from 5cb33db to c4baa89 Compare July 24, 2020 09:07

chore: version

5477810

nighca approved these changes Jul 24, 2020

View reviewed changes

nighca merged commit 99ec547 into qiniu:master Jul 24, 2020

nighca changed the title ~~v1.18.0 (polyfill type)~~ optimization.addPolyfill 支持指定 polyfill 方式 Jul 24, 2020


		使用什么形式的 polyfill

		- 默认值：`default`，即：使用基于 `useBuiltIns` 的 polyfill，polyfill 会被作为独立的包被页面前置引用，会污染全局内置对象，适合大型应用；

optimization.addPolyfill 支持指定 polyfill 方式 #126

optimization.addPolyfill 支持指定 polyfill 方式 #126

Conversation

surmon-china commented Jul 10, 2020 • edited by nighca Loading

surmon-china commented Jul 13, 2020

lzfee0227 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nighca left a comment

Choose a reason for hiding this comment

surmon-china commented Jul 21, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nighca commented Jul 22, 2020 • edited Loading

Choose a reason for hiding this comment

nighca Jul 22, 2020 • edited Loading

Choose a reason for hiding this comment

surmon-china Jul 22, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nighca Jul 23, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

lzfee0227 Jul 23, 2020 • edited Loading

Choose a reason for hiding this comment

This comment was marked as resolved.

nighca left a comment

Choose a reason for hiding this comment

huangbinjie left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

huangbinjie commented Jul 23, 2020

nighca commented Jul 24, 2020 • edited Loading

surmon-china commented Jul 24, 2020

nighca left a comment

Choose a reason for hiding this comment

surmon-china commented Jul 10, 2020 •

edited by nighca

Loading

surmon-china commented Jul 21, 2020 •

edited

Loading

nighca commented Jul 22, 2020 •

edited

Loading

nighca Jul 22, 2020 •

edited

Loading

surmon-china Jul 22, 2020 •

edited

Loading

nighca Jul 23, 2020 •

edited

Loading

lzfee0227 Jul 23, 2020 •

edited

Loading

nighca commented Jul 24, 2020 •

edited

Loading