DllReferencePlugin doesn't work with HotModuleReplacement when the webpack config is not the same directory of dll bundles

Do you want to request a feature or report a bug?

What is the current behavior? So we have two project in two repos, one for compiling and one for app itself. The dll config is in app directory, and webpack config is in compile directory.

app/
-- node_modules
-- dll/
     --- vendor.dll.js
     ---vendor.manifest.js
-- app.js
-- dll.config.js (used to generate dll bundle)

compile/
-- node_modules
-- compile.js
-- webpack.config.js

It works fine for initial build. Dll work well. However when it comes to hot load, hot replacement plugin cannot find dll reference and generate correct hot-update.json. like this:

var e = new Error(\"Cannot find module \\\"dll-reference vendor_2fbac64ff6173d91e522\\\"\")

Hot load only works when I move the part of webpack config that use DllReferencePlugin back to app directories, like this

app/
-- node_modules
-- dll/
     ---vendor.dll.js
      ---vendor.manifest.js
-- app.js
-- dll.config.js
-- webpack.dllreference.config.js

compile/
-- node_modules
-- compile.js
-- webpack.config.js (import webpack.dllreference.config.js inside)

I checked the context I’ve pass into DllReferencePlugin for both way, it’s same because I’m always using process.cwd

If the current behavior is a bug, please provide the steps to reproduce.

my dll.config.js

import webpack from 'webpack';
import path from 'path';

const basePath = process.cwd();

export default {
  entry: {
    'vendor': [
       // list of vendor packages
    ],
  },
  output: {
    filename: '[name].dll.[chunkhash].js',
    path: path.join(basePath, 'dll/'),

    // The name of the global variable which the library's
    // require() function will be assigned to
    library: '[name]_[chunkhash]',
  },
  module: {
    // these loaders are needed for one of the vendor packages
    rules: [
      {
        test: /\.css$/,
        use: [
          'style-loader',
          'css-loader',
        ],
      },
      {
        test: /\.(jpe?g|png|gif|eot|svg|ttf|woff|woff2)$/i,
        use: [
          'file-loader',
        ],
      },
    ],
  },
  plugins: [
    new webpack.DllPlugin({
      path: path.join(basePath, 'dll/[name].manifest.json'),
      name: '[name]_[chunkhash]',
    }),
  ],
};

What is the expected behavior?

Hot Module Replacement plugin should find dll reference when making hot-update.json

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.

node 6.9.5 webpack 3.4.1 mac os

[ldeavila]

@ethanyanjiali We are investigating a similar error Cannot find module "dll-reference dependencies".

Our current work around is to set cache: false Does setting cache: false resolve the error for you.

With cache: true we receive the error some times. @sokra If you are interested in viewing our error I can point you to a branch where the issue is easily reproducible.

[zhangsanshi]

add all vender lib into entry in your webpack.config.js。

webpack.dll.config

import webpack from 'webpack';
import path from 'path';

const basePath = process.cwd();

export default {
  entry: {
    'vendor': [
       'a', 'b', 'c' // lib
    ],
  },
  output: {
    filename: '[name].dll.[chunkhash].js',
    path: path.join(basePath, 'dll/'),

    // The name of the global variable which the library's
    // require() function will be assigned to
    library: '[name]_[chunkhash]',
  },
  module: {
    // these loaders are needed for one of the vendor packages
    rules: [
      {
        test: /\.css$/,
        use: [
          'style-loader',
          'css-loader',
        ],
      },
      {
        test: /\.(jpe?g|png|gif|eot|svg|ttf|woff|woff2)$/i,
        use: [
          'file-loader',
        ],
      },
    ],
  },
  plugins: [
    new webpack.DllPlugin({
      path: path.join(basePath, 'dll/[name].manifest.json'),
      name: '[name]_[chunkhash]',
    }),
  ],
};

webpack.config.js

import webpack from 'webpack';

export default {
  entry: {
    'app': [
       'a', 'b', 'c', 'src/index.js'  // add all lib into entry
    ],
  },
...others
};