CODEWITHSUNDEEP
javascriptnode.jsreactjswebpack
spdaly
spdaly

Reputation: 1260

Excluding modules from Webpack DLL build

I have a Webpack build for a universal Javascript application. I am using the DLL plugin to pre-build all my node_modules. I added a lib that is causing the DLL build to error out (see below).

I can probably add a JSON loader to solve the problem. But I don't want the lib in the React code at all. I added it to my exclusion list, but it is still throwing an error.

Here's the error:

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 build script:

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
  ],
};

DLL Plugin configuration from package.json:

"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"
  ]
},

Upvotes: 2

Views: 3118

Answers (2)

AngryBadger69
AngryBadger69

Reputation: 26

NOTE: This is for react-boilerplate only.

To exclude the module from the DllPlugin you need to add the module (or the module that has it marked at its dependant in your excludes array):

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

If is important to note that if you did not install the constants-browserify module directly, you will need to find the module that has marked it as a dependancy.

Alternatively, and as you say, if you want load the module then you need to specify a loader for the .json file that the DllPlugin is attempting to parse:

Place:

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

inside of your

module.exports = { ... }

This will allow WebPack to correctly parse the .json file.

Upvotes: 0

Digger2000
Digger2000

Reputation: 546

I think you can exclude some modules with IgnorePlugin or ignore-loader.

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

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

Upvotes: 1

Related Questions