相关疑难解决方法(0)

我有两个文件,它们组合在600字节(.6kb)下,如下所示.

那么我的app.bundle.js怎么这么大(987kb),更重要的是如何管理它的大小呢？

src文件index.js

import _ from 'lodash';
import printMe from './print.js';


  function component() {
    var element = document.createElement('div');
    var btn = document.createElement('button');

    // Lodash, now imported by this script
    element.innerHTML = _.join(['Hello', 'webpack'], ' ');

    btn.innerHTML = 'click and check console';
    btn.onclick = printMe;

    element.appendChild(btn);

    return element;
  }

  document.body.appendChild(component());

src文件print.js

export default function printMe() {
  consoe.log('Called from print.js');
}

webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');

module.exports = {
  entry: {
    app: './src/index.js',
    print:'./src/print.js' …

当我在生产模式下运行webpack时.有一个警告,资产大小限制(超过).如何在没有此错误的情况下运行？

在我的项目中,我包含了css,我在webpack构建中看到了一些node_module目录.但是,如果我排除css的node_module,它将有错误.

以下是我尝试使用webpack构建项目时的输出.

[mai@localhost dssoft]$ yarn run build
yarn run v1.9.2
$ webpack --config webpack.config.js
Hash: a5edfb917e6152759218
Version: webpack 4.16.3
Time: 16592ms
Built at: 08/07/2018 7:58:40 PM
                                 Asset      Size  Chunks                    Chunk Names
  f4769f9bdb7466be65088239c12046d1.eot  19.7 KiB          [emitted]         
448c34a56d699c29117adc64c43affeb.woff2  17.6 KiB          [emitted]         
 fa2772327f55d8198301fdb8bcfc8158.woff  22.9 KiB          [emitted]         
  e18bbf611f2a2e43afc071aa2f4e1512.ttf  44.3 KiB          [emitted]         
  89889688147bd7575d6327160d64e760.svg   106 KiB          [emitted]         
                             bundle.js   624 KiB       0  [emitted]  [big]  main
Entrypoint main [big] = bundle.js
 [22] ./node_modules/react-router-dom/es/index.js + 34 modules 80.3 KiB {0} [built]
      |    35 modules
 [29] ./node_modules/react-bootstrap/es/index.js + 104 …