3

我刚刚将我们的代码库从使用 CommonJS 转换为使用 ES6 模块，并且 webpack 包的大小显着增加。每个入口点增加 7-10%。

除了一些小例外，我在代码库中唯一更改的是 require() 和 module.exports。

  1. 这是预期的行为吗？
  2. 我能做些什么吗？

使用 CommonJS (require/modules.exports)。

Hash: c28bee3539ce44ae155145a2789b4336103ffa71
Version: webpack 3.10.0
Child main:
    Hash: c28bee3539ce44ae1551
    Time: 19467ms
                                             Asset      Size            Chunks                    Chunk Names
    css/index-b84840cc6018eefd410162b49a28a1df.css    105 kB            styles  [emitted]         styles
               js/detailed-135815d2133bfc036df3.js   55.9 kB          detailed  [emitted]         detailed
                js/gateway-78051949b4aff7f01e3f.js   11.2 kB           gateway  [emitted]         gateway
                   js/home-dfd25d354b53a0a52664.js   22.6 kB              home  [emitted]         home
                  js/index-128cc698ee47701c7d5f.js    173 kB             index  [emitted]         index
       js/locationOverview-da34e47bd0ef25541d87.js   50.8 kB  locationOverview  [emitted]         locationOverview
                    js/map-508c7c3219a0132a2241.js    308 kB               map  [emitted]  [big]  map
                js/runtime-85e9a32b14af1863f43e.js   1.83 kB           runtime  [emitted]         runtime
                 js/search-4eb0a41318e321267281.js   5.72 kB            search  [emitted]         search
                 js/styles-bd0518e19d5e56b93d5e.js  57 bytes            styles  [emitted]         styles
                js/vendors-d1e3e281a4de6fa0902f.js    108 kB           vendors  [emitted]         vendors
     + 491 hidden assets
Child other:
    Hash: 45a2789b4336103ffa71
    Time: 5650ms
                                       Asset     Size         Chunks             Chunk Names
    js/es5-polyfills-12d418c4671211cb6aa0.js  27.9 kB  es5-polyfills  [emitted]  es5-polyfills
    js/es6-polyfills-397de7b6bc2bfecda6bb.js  10.3 kB  es6-polyfills  [emitted]  es6-polyfills
        js/unispring-b733487bd631830e8b81.js  8.08 kB                 [emitted]
✨  Done in 20.90s.

使用 ES6 模块（导入/导出）

Hash: ce4bb2088ffda28f39ac384f07d403b8ec6d08ad
Version: webpack 3.10.0
Child main:
    Hash: ce4bb2088ffda28f39ac
    Time: 20047ms
                                             Asset      Size            Chunks                    Chunk Names
    css/index-3d9aebfa961c57af4aded0b11cd92896.css    105 kB            styles  [emitted]         styles
               js/detailed-57036f070f2efe0a532a.js   62.8 kB          detailed  [emitted]         detailed
                js/gateway-68359f35446566320918.js   11.9 kB           gateway  [emitted]         gateway
                   js/home-9ef07427bfdc2af6dca4.js   25.3 kB              home  [emitted]         home
                  js/index-4b3e7fa51d8847126ab2.js    190 kB             index  [emitted]         index
       js/locationOverview-4d092f1d7f86ae041aec.js   57.6 kB  locationOverview  [emitted]         locationOverview
                    js/map-0d4e6ff209885a5f1c23.js    309 kB               map  [emitted]  [big]  map
                js/runtime-649d8e3c72ba55160b8d.js   1.83 kB           runtime  [emitted]         runtime
                 js/search-ed5b49bd57623fc29cdc.js   6.81 kB            search  [emitted]         search
                 js/styles-bd0518e19d5e56b93d5e.js  57 bytes            styles  [emitted]         styles
                js/vendors-d1e3e281a4de6fa0902f.js    108 kB           vendors  [emitted]         vendors
     + 491 hidden assets
Child other:
    Hash: 384f07d403b8ec6d08ad
    Time: 6054ms
                                       Asset     Size         Chunks             Chunk Names
    js/es5-polyfills-5103a458844516295a00.js  27.9 kB  es5-polyfills  [emitted]  es5-polyfills
    js/es6-polyfills-3378a2bda37d3c390916.js  10.4 kB  es6-polyfills  [emitted]  es6-polyfills
        js/unispring-b733487bd631830e8b81.js  8.08 kB                 [emitted]
✨  Done in 21.40s.

我还尝试为 babel 加载程序打开 modules:false （https://babeljs.io/docs/plugins/preset-env/#modules），并添加 ModuleConcatenationPlugin，这有点帮助，但它们仍然相当不错大一点：

Hash: e0943ec0dc298e1fcbae384f07d403b8ec6d08ad
Version: webpack 3.10.0
Child main:
    Hash: e0943ec0dc298e1fcbae
    Time: 25813ms
                                             Asset      Size            Chunks                    Chunk Names
    css/index-3d9aebfa961c57af4aded0b11cd92896.css    105 kB            styles  [emitted]         styles
               js/detailed-fdb35c690280307b9f31.js   61.8 kB          detailed  [emitted]         detailed
                js/gateway-7e13139dc35af786c9c7.js   11.8 kB           gateway  [emitted]         gateway
                   js/home-7d6f6116ab51068e2f65.js   24.4 kB              home  [emitted]         home
                  js/index-0c63960f1628260413a5.js    184 kB             index  [emitted]         index
       js/locationOverview-8dad48655384cbfaba18.js   55.5 kB  locationOverview  [emitted]         locationOverview
                    js/map-384facd600e6b3de3da5.js    308 kB               map  [emitted]  [big]  map
                js/runtime-667c7795332019a04c5d.js   1.83 kB           runtime  [emitted]         runtime
                 js/search-caffe4e50e96fd26f66d.js   6.13 kB            search  [emitted]         search
                 js/styles-bd0518e19d5e56b93d5e.js  57 bytes            styles  [emitted]         styles
                js/vendors-d1e3e281a4de6fa0902f.js    108 kB           vendors  [emitted]         vendors
     + 491 hidden assets
Child other:
    Hash: 384f07d403b8ec6d08ad
    Time: 11322ms
                                       Asset     Size         Chunks             Chunk Names
    js/es5-polyfills-5103a458844516295a00.js  27.9 kB  es5-polyfills  [emitted]  es5-polyfills
    js/es6-polyfills-3378a2bda37d3c390916.js  10.4 kB  es6-polyfills  [emitted]  es6-polyfills
        js/unispring-b733487bd631830e8b81.js  8.08 kB                 [emitted]
✨  Done in 30.88s.
4

0 回答 0