Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Webpack 5.x not supportted, because compiler.hooks can not add property #546

Open
hzsrc opened this issue Mar 30, 2021 · 5 comments
Open

Comments

@hzsrc
Copy link

hzsrc commented Mar 30, 2021

Expected Behavior

Support webpack 5.x

Actual Behavior

Not supportted.

Is an error being thrown?

Yes, throws an error:

TypeError: Cannot read property 'tap' of undefined
    at Object.exports.tap (D:\proj\h5\node_modules\hard-source-webpack-plugin\lib\util\plugin-compat.js:118:25)
    at new CacheSerializerFactory (D:\proj\h5\node_modules\hard-source-webpack-plugin\lib\CacheSerializerFactory.js:94:18)
    at HardSourceWebpackPlugin.apply (D:\proj\h5\node_modules\hard-source-webpack-plugin\index.js:219:36)
    at createCompiler (D:\proj\h5\node_modules\webpack\lib\webpack.js:71:12)
    at create (D:\proj\h5\node_modules\webpack\lib\webpack.js:118:16)
    at webpack (D:\proj\h5\node_modules\webpack\lib\webpack.js:142:32)
    at f (D:\proj\h5\node_modules\webpack\lib\index.js:41:15)
 

Steps to Reproduce

  • Use webpack 5.24.3
  • Webpack plugins include: new HardSourceWebpackPlugin()

Operating System, Node, and NPM dependency versions

Windows 10
node@12.12
npm@6.11.3

"devDependencies": {
  "babel-core": "^6.26.0",
  "babel-loader": "^7.1.4",
  "babel-preset-env": "^1.6.1",
  "css-loader": "^0.27.0",
  "html-webpack-plugin": "^3.2.0",
  "mini-css-extract-plugin": "^0.4.0",
  "style-loader": "^0.14.0",
  "webpack": "^5.24.3",
  "webpack-cli": "^1.5.3"
},
"dependencies": {
  "lodash": "^4.15.0"
}
@hzsrc
Copy link
Author

hzsrc commented Mar 30, 2021

In webpack 5.x, the compiler.hooks can not add any property into it.
image

So, when get the hardSourceCacheFactory property in tapable.hooks, it returns undefined:
image

@hzsrc
Copy link
Author

hzsrc commented Mar 30, 2021

Same error: AnomalyInnovations/serverless-bundle#178

pogopaule added a commit to karrot-dev/karrot-frontend that referenced this issue May 19, 2021
@amerllica
Copy link

@hzsrc What's the update?

@phillipuniverse
Copy link

@amerllica FYI I was able to remove this plugin completely in favor of native Webpack 5 filesystem caching.

This is what I added to my webpack.config.js to enable it:

    cache: {
      type: 'filesystem',
      buildDependencies: {
        config: [__filename]
      }
    },

On the first run of the dev server it populates the cache and takes ~1min, when I re-run it starts up in ~10s.

Also see #514 (comment)

@amerllica
Copy link

@phillipuniverse, Thanks for your comment, my project is so big, very very big, so by using the native Webpack caching system, after the first time, I reduce the re-build time to 1min, I hope to find a way to reduce it below 300ms.

Finally, thanks.

tiltec pushed a commit to karrot-dev/karrot-frontend that referenced this issue Sep 1, 2021
tiltec added a commit to karrot-dev/karrot-frontend that referenced this issue May 8, 2022
* rename styl files to sass files

* install quasar v2 and quasar/app v3

* upgrade eslint

* update quasar.conf.js

* remove hard-source-webpack-plugin

It is not compatible with webpack 5. mzgoddard/hard-source-webpack-plugin#546

* migrate stylus syntax to sass syntax

* fix line in .eslintrc

* upgrade vue router

https://next.router.vuejs.org/guide/migration/index.html

* upgrade vuex

https://next.quasar.dev/start/upgrade-guide#vuex-v4

* upgrade vue-i18n

https://next.quasar.dev/start/upgrade-guide#vue-i18n-v9

* content-class -> class and content-style -> style

https://next.quasar.dev/start/upgrade-guide#qdrawer-qdialog-qmenu-qtooltip

* update QScrollObserver

https://next.quasar.dev/start/upgrade-guide#qscrollobserver

* update QTable

://next.quasar.dev/start/upgrade-guide#qtable

* zh-hant -> zh-TW

* add stylus loader

* upgrade vue-router, vuex, eslint-parser

downgrade stylus-loader

* remove old vue dependency

* fix datastore and boot files

* WIP fix storybook

* fix storybook setup

* fix first story

* fix i18n datetime breaking change

* fix storybook $icon support

* rewrite some component styles to sass

* change stylelint to look for sass files

* remove $listeners

* WIP messy upgrade

* fix two more tests

* updates & fixes

* yarn upgrade

* add @-alias for service worker compilation

* try to fix some tests

* rewrite '>>>' to '::v-deep()'

* add percentage sign

* update dependencies

* add back margin on feedbackitem

* fix statistics sidenav entry

* fix some redirects

* fix: value -> modelValue

* fix date-time input on small screens

* fix search

* ignore storybook-static

* hey linter

* hey hey

* fix mobile sidenav

* fix some map stuff

* avoid CSP by using vue-i18n runtime

* Revert "avoid CSP by using vue-i18n runtime"

This reverts commit 7438954.

* yarn upgrade

* skip extra upgrade step

* drop outdated comment

* clarify comment about compat mode

* Fix sending wall messages

* Update deps

* Downgrade to jest 27

Until vuejs/vue-jest#467

* replace unmaintained eslint-plugin-node
with eslint-plugin-n

* adjust code style

eslint-config-standard has evolved

* try skipping one test

* Fix storyshot tests

* Update snapshots

* Style fixes

* Remove debug logging

* Fix router tests

* Fix signup component test

* Fix conversation tests

* Fix map tests

* Style fixes

* Update snapshots

There is a discrepancy with the date formatting depending on
different installations of nodejs, so this might be an ongoing
issue....

* Explain use of markRaw

* remove double space

Co-authored-by: pogopaule <pogopaule@posteo.de>
Co-authored-by: Nick Sellen <git@nicksellen.co.uk>
philipp-classen added a commit to philipp-classen/common that referenced this issue Aug 30, 2022
Background for the changes:
* replace `{ fs: 'empty' }` by `resolve: { fallback: { fs: false } }`
  * https://stackoverflow.com/a/64392550/783510

* hard-source-webpack-plugin is incompatible with webpack 5; instead
  webpack 5 added native caching, which is automatically enabled in
  development mode:
  * mzgoddard/hard-source-webpack-plugin#546 (comment)
  * https://webpack.js.org/configuration/cache/#cache
philipp-classen added a commit to ghostery/common that referenced this issue Aug 30, 2022
Background for the changes:
* replace `{ fs: 'empty' }` by `resolve: { fallback: { fs: false } }`
  * https://stackoverflow.com/a/64392550/783510

* hard-source-webpack-plugin is incompatible with webpack 5; instead
  webpack 5 added native caching, which is automatically enabled in
  development mode:
  * mzgoddard/hard-source-webpack-plugin#546 (comment)
  * https://webpack.js.org/configuration/cache/#cache
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants