Question

我已经尝试了很多不同的东西来使这个工作，但没有成功，我可以从我的webpack构建反应出来并用作外部：

这是我的webpack文件：

plugins: [
    new webpack.NoErrorsPlugin(),
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery",
      "windows.jQuery": "jquery"
    }),
    new ExtractTextPlugin("[name]-[hash].css", {allChunks: true}),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.UglifyJsPlugin({
            compressor: {
                warnings: false
            }
        }),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.AggressiveMergingPlugin(),
    webpack_isomorphic_tools_plugin
  ],
  externals: {
    'jquery': 'jQuery',
    'jquery': '$',
    'react': 'React',
    'react-dom': 'ReactDOM',
    'keen-js': 'Keen',
    'immutable': 'Immutable',
    'superagent': 'superagent'
  },

和我的构建分析：

react: 597.97 kB (49.8%)
  fbjs: 32.85 kB (5.49%)
    <self>: 32.85 kB (100%)
  <self>: 565.12 kB (94.5%)
babel-core: 132.01 kB (11.0%)
  core-js: 111.1 kB (84.2%)
    <self>: 111.1 kB (100%)
  <self>: 247 B (0.183%)
fluxible: 52.13 kB (4.34%)
  dispatchr: 24.77 kB (47.5%)
    eventemitter3: 7 kB (28.3%)
      <self>: 7 kB (100%)
    inherits: 672 B (2.65%)
      <self>: 672 B (100%)
    <self>: 17.11 kB (69.1%)
  setimmediate: 6.24 kB (12.0%)
    <self>: 6.24 kB (100%)
  is-promise: 165 B (0.309%)
    <self>: 165 B (100%)
  <self>: 20.97 kB (40.2%)
fluxible-router: 50.76 kB (4.23%)
  routr: 18.22 kB (35.9%)
    path-to-regexp: 9.25 kB (50.7%)
      isarray: 120 B (1.27%)
        <self>: 120 B (100%)
      <self>: 9.13 kB (98.7%)
    <self>: 8.97 kB (49.3%)
  query-string: 1.52 kB (2.99%)
    strict-uri-encode: 168 B (10.8%)
      <self>: 168 B (100%)
    <self>: 1.35 kB (89.2%)
  hoist-non-react-statics: 854 B (1.64%)
    <self>: 854 B (100%)
  inherits: 672 B (1.29%)
    <self>: 672 B (100%)
  <self>: 29.53 kB (58.2%)
bootstrap-sass: 33.37 kB (2.78%)
  <self>: 33.37 kB (100%)
promise: 20.78 kB (1.73%)
  asap: 11.43 kB (55.0%)
    <self>: 11.43 kB (100%)
  <self>: 9.35 kB (45.0%)
react-paginate: 17.27 kB (1.44%)
  classnames: 988 B (5.59%)
    <self>: 988 B (100%)
  react-addons-create-fragment: 59 B (0.334%)
    <self>: 59 B (100%)
  <self>: 16.25 kB (94.1%)
fluxible-addons-react: 16.84 kB (1.40%)
  hoist-non-react-statics: 854 B (4.95%)
    <self>: 854 B (100%)
  <self>: 16 kB (95.0%)
debug: 9.95 kB (0.829%)
  ms: 2.28 kB (22.9%)
    <self>: 2.28 kB (100%)
  <self>: 7.67 kB (77.1%)
react-cookie: 5.05 kB (0.420%)
  cookie: 3.29 kB (65.3%)
    <self>: 3.29 kB (100%)
  <self>: 1.75 kB (34.7%)
webpack: 4.06 kB (0.338%)
  <self>: 0 B (0.00%)
superagent-promise: 2.65 kB (0.221%)
  <self>: 2.65 kB (100%)
copy-to-clipboard: 1.92 kB (0.160%)
  toggle-selection: 807 B (41.0%)
    <self>: 807 B (100%)
  <self>: 1.13 kB (59.0%)
react-google-analytics: 1.58 kB (0.132%)
  <self>: 1.58 kB (100%)
classnames: 1.08 kB (0.0900%)
  <self>: 1.08 kB (100%)
react-dom: 63 B (0.00512%)
  <self>: 63 B (100%)
babel: 49 B (0.00398%)
  <self>: 49 B (100%)
<self>: 253.4 kB (21.1%)

正如你所看到的，反应是我构建的惊人的49.8％！而400kb的构建，这是很多。有关如何使用外部设备的任何想法？

Answer 1

这不是你要求的，但是因为你的想法：看看https://github.com/insin/nwb。它对创建React组件和库有很好的支持。它使用引擎盖下的webpack。

作为webpack外部依赖项发起反应

1 个答案: