Webpack генерирует странно большой кусок (для html2canvas), который пропускает не минимизированный исходный код - PullRequest
Новая
       14

Webpack генерирует странно большой кусок (для html2canvas), который пропускает не минимизированный исходный код

0 голосов
/ 11 мая 2019

Я импортировал html2canvas динамически с чанком веб-пакета, и он работал хорошо для меня.Тем не менее, я просто попытался обновить html2canvas с 1.0.0-alpha.12 до 1.0.0-rc1, и внезапно порция, генерируемая webpack, более чем в два раза больше, и порция содержит не минимизированные исходные файлы в строках, поэтому неудивительно, что порцияогромный.

Минимальная настройка выглядит следующим образом:

package.json: 

{
  "dependencies": {
    "html2canvas": "1.0.0-rc.1"
  },
  "devDependencies": {
    "@babel/core": "^7.4.4",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "babel-loader": "^8.0.5",
    "webpack": "4.31.0"
  }
}

index.js: 

import(/* webpackChunkName: 'h2c' */ './h2c').then((module) => {
  const html2canvas = module.default;
});

h2c.js: 

import html2canvas from 'html2canvas';
export default html2canvas;

webpack.config.js: 

module.exports = {
  entry: {
    index: './index.js',
  },
  output: {
    filename: '[name].min.js',
    chunkFilename: '[name].chunk.[chunkhash].min.js',
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        use: 'babel-loader'
      }
    ]
  },
};

При html2canvas 1.0.0-alpha.12, vendors~h2c.chunk.min.js составляет всего 161 КиБ;однако с 1.0.0-rc.1 (без других изменений) vendors~h2c.chunk.min.js раздувается до 353 КиБ, и предположительно минимизированный кусок заполнен такими вещами: 

{"./node_modules/css-line-break/dist/LineBreak.js":
/*!*******************************************************!*\
        !*** ./node_modules/css-line-break/dist/LineBreak.js ***!
        \*******************************************************/
/*! no static exports found */
function(module,exports,__webpack_require__){"use strict";eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n    value: true\n});\nexports.LineBreaker = exports.inlineBreakOpportunities = exports.lineBreakAtIndex = exports.codePointsToCharacterClasses = exports.UnicodeTrie = exports.BREAK_ALLOWED = exports.BREAK_NOT_ALLOWED = exports.BREAK_MANDATORY = exports.classes = exports.LETTER_NUMBER_MODIFIER = undefined;\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; ...

Есть идеи, что здесь происходит?

...