Question

我有一个用于通用Javascript应用程序的Webpack构建。我正在使用DLL插件来预构建我的所有node_modules。我添加了一个导致DLL构建错误的库（见下文）。

我可以添加一个JSON加载器来解决问题。但我根本不想在React代码中使用lib。我将它添加到我的排除列表中，但它仍然是一个错误。

这是错误：

Building the Webpack DLL...
Hash: a69a927bfa72ddef88d5
Version: webpack 2.1.0-beta.15
Time: 7152ms
                      Asset     Size  Chunks             Chunk Names
reactBoilerplateDeps.dll.js  5.58 MB       0  [emitted]  reactBoilerplateDeps
chunk    {0} reactBoilerplateDeps.dll.js (reactBoilerplateDeps) 5.07 MB [rendered]
 [1135] dll reactBoilerplateDeps 12 bytes {0} [built]
     + 1137 hidden modules

ERROR in ./~/constants-browserify/constants.json
Module parse failed: /Users/steve/Projects/elucidate/node_modules/constants-browserify/constants.json Unexpected token (2:12)
You may need an appropriate loader to handle this file type.
| {
|   "O_RDONLY": 0,
|   "O_WRONLY": 1,
|   "O_RDWR": 2,
 @ ./~/graceful-fs/polyfills.js 2:16-36

Webpack DLL构建脚本：

const { join } = require('path');
const defaults = require('lodash/defaultsDeep');
const webpack = require('webpack');
const pkg = require(join(process.cwd(), 'package.json'));
const dllPlugin = require('../config').dllPlugin;

if (!pkg.dllPlugin) { process.exit(0); }

const dllConfig = defaults(pkg.dllPlugin, dllPlugin.defaults);
const outputPath = join(process.cwd(), dllConfig.path);

module.exports = {
  context: process.cwd(),
  entry: dllConfig.dlls ? dllConfig.dlls : dllPlugin.entry(pkg),
  devtool: 'eval',
  output: {
    filename: '[name].dll.js',
    path: outputPath,
    library: '[name]',
  },
  node: {
    fs: "empty",
  },
  plugins: [
    new webpack.DllPlugin({ name: '[name]', path: join(outputPath, '[name].json') }), // eslint-disable-line no-new
  ],
};

来自package.json的

DLL插件配置：

"dllPlugin": {
  "path": "node_modules/react-boilerplate-dlls",
  "exclude": [
    "chalk",
    "compression",
    "cross-env",
    "express",
    "ip",
    "minimist",
    "sanitize.css",
    "multiparty",
    "cloudinary",
    "winston",
    "morgan",
    "body-parser",
    "request-promise",
    "winston-graylog2",
    "yauzl",
    "busboy",
    "graceful-fs"
  ],
  "include": [
    "core-js",
    "lodash",
    "eventsource-polyfill"
  ]
},

Answer 1

我认为您可以使用IgnorePlugin或ignore-loader排除某些模块。

https://webpack.github.io/docs/list-of-plugins.html#ignoreplugin

https://github.com/cherrry/ignore-loader

Answer 2

注意：这仅适用于react-boilerplate。

要从DllPlugin中排除模块，您需要添加模块（或在exludes数组中标记为依赖的模块）：

excludes = { 
  "constants-browserify",
  ... }

如果重要的是要注意，如果您没有直接安装constants-browserify模块，则需要找到将其标记为依赖的模块。

或者，正如您所说，如果您想加载模块，那么您需要为DllPlugin尝试解析的.json文件指定加载器：

地点：

module: {
  loaders: [
    {
      test: /\.json$/,
      loader: 'json-loader',
    }
  ],
},

你的

module.exports = { ... }

这将允许WebPack正确解析.json文件。

从Webpack DLL构建中排除模块

2 个答案: