TypeError: resolver.ensureHook is not a function

[ankurk91]

Hi, @arcanis

I followed your instructions and made some progress but i am still facing issues. You can check my webpack.config.dev.js

Environment

• yarn : 1.12.1
• node : 10.13 LTS (nvm)
• OS: MacOS 10.14 stable
• Webpack: 4.23.1

Steps

git clone https://github.com/ankurk91/vue-flatpickr-component.git -b feat/pnp --single-branch
cd vue-flatpickr-component
yarn install
yarn run docs

You will see this error

Click to see error log

``` yarn run v1.12.1 $ cross-env NODE_ENV=production webpack --config=webpack.config.dev.js --progress --mode production /Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-cli-3.1.2-17d7e01b77f89f884a2bbf9db545f0f6a648e746/node_modules/webpack-cli/bin/cli.js:453 throw err; ^ TypeError: resolver.ensureHook is not a function at Object.resolver [as apply] (/Users/ankurk/Library/Caches/Yarn/v3/npm-pnp-webpack-plugin-1.2.0-a85338bc313b8a0469c1d8c5c5d016873be47cb2/node_modules/pnp-webpack-plugin/index.js:48:35) at webpack (/Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-4.23.1-db7467b116771ae020c58bdfe2a0822785bb8239/node_modules/webpack/lib/webpack.js:47:13) at processOptions (/Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-cli-3.1.2-17d7e01b77f89f884a2bbf9db545f0f6a648e746/node_modules/webpack-cli/bin/cli.js:441:16) at yargs.parse (/Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-cli-3.1.2-17d7e01b77f89f884a2bbf9db545f0f6a648e746/node_modules/webpack-cli/bin/cli.js:536:3) at Object.parse (/Users/ankurk/Library/Caches/Yarn/v3/npm-yargs-12.0.2-fe58234369392af33ecbef53819171eff0f5aadc/node_modules/yargs/yargs.js:563:18) at /Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-cli-3.1.2-17d7e01b77f89f884a2bbf9db545f0f6a648e746/node_modules/webpack-cli/bin/cli.js:219:8 at Object. (/Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-cli-3.1.2-17d7e01b77f89f884a2bbf9db545f0f6a648e746/node_modules/webpack-cli/bin/cli.js:538:3) at Module._compile (internal/modules/cjs/loader.js:688:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10) at Module.load (internal/modules/cjs/loader.js:598:32) at Function.Module._load (/Users/ankurk/projects/p/vue-flatpickr-component/.pnp.js:11592:14) at Module.require (internal/modules/cjs/loader.js:636:17) at require (internal/modules/cjs/helpers.js:20:18) at Object. (/Users/ankurk/Library/Caches/Yarn/v3/npm-webpack-4.23.1-db7467b116771ae020c58bdfe2a0822785bb8239/node_modules/webpack/bin/webpack.js:155:2) at Module._compile (internal/modules/cjs/loader.js:688:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10) at Module.load (internal/modules/cjs/loader.js:598:32) at Function.Module._load (/Users/ankurk/projects/p/vue-flatpickr-component/.pnp.js:11592:14) at Function.Module.runMain (internal/modules/cjs/loader.js:741:12) at startup (internal/bootstrap/node.js:285:19) at bootstrapNodeJSCore (internal/bootstrap/node.js:739:3) error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command ```

I am using the latest version of the packages. Let me know what i am missing here.

[jennale]

I had this issue as well, and it was because I mistakenly placed the PnpWebpackPlugin within the regular plugins: [ ... ] array instead of inside the resolveLoader : { plugins: [ ... ] }.

Maybe double check your webpack.config.js?

const PnpWebpackPlugin = require(`pnp-webpack-plugin`);

module.exports = {
  resolve: {
    plugins: [
      PnpWebpackPlugin,
    ],
  },
  resolveLoader: {
    plugins: [
      PnpWebpackPlugin.moduleLoader(module),
    ],
  },
  plugins : [  
    // ** NOT in here **
    // PnpWebpackPlugin.moduleLoader(module)
  ]
  // ... etc
};

Note that it goes into both the resolve and resolveLoader plugins arrays

[arcanis]

Might be good to check for this kind of thing and print an helpful error message 😃

[ankurk91]

@jennale Thank you so much for pointing out this. I was able to successfully use pnp feature.

@arcanis Agree, it would be nice to warn user when they mistakenly place the plugin at wrong place.

[imjeremyhi]

I'm getting this issue but have it configured in the right place. I'm working in a webpack 3 repo. Does this have any incompatibility issues between webpack 3 and 4? @arcanis resolve: { plugins: [ PnpWebpackPlugin, ], }, resolveLoader: { plugins: [ PnpWebpackPlugin.moduleLoader(module), ], },

[arcanis]

Yes, webpack 3 (actually enhanced-resolve 3) uses a different API for plugins. It should be fairly easy to support both styles of APIs though, if you'd like to start a PR!

[jscheid]

I have something working and going to push a PR soon.

@arcanis Do you think this is necessary for older enhanced-resolve versions and if so, is it covered by the tests? https://github.com/arcanis/pnp-webpack-plugin/blob/b09fbdc2a9f16dc3837454b8d367963b1a30655f/index.js#L60-L66

[arcanis]

I'm not sure what's the behavior on older enhanced-resolve releases, but the intent is that symlinks shouldn't be resolved (otherwise it breaks peer dependencies).

It seems it isn't tested at the moment - if you can add one it would be perfect (you can just create a dummy symlink in the fixtures folder and use that to make sure that it isn't resolved by enhanced-resolve).

[xiayuxiaoyan]

when i using awesome-typescript-loader.TsConfigPathsPlugin, this function was used. in webpack4. i got the same error