UnhandledPromiseRejectionWarning: TypeError: Cannot destructure property 'service' of 'this._compiler.$tailwind' as it is undefined.
pySilver opened this issue · 7 comments
Hi!
I'm just trying to make it work with basic Laravel Mix (webpack warpper) setup and it fails with:
~/P/sample-ui[130]>yarn watch 323.18s (main|✚) 17:15
yarn yarn watch 323.18s (main|✚) 17:15
yarn run v1.22.17
$ mix watch
● Mix █████████████████████████ building (10%) 0/3 entries 2/3 dependencies 0/2 modules 2 active
● Mix █████████████████████████ building (10%) 0/3 entries 5/11 dependencies 0/5 modules 5 active
● Mix █████████████████████████ building (10%) 0/3 entries 16/21 dependencies 2/15 modules 13 active
● Mix █████████████████████████ building (10%) 0/3 entries 28/38 dependencies 3/20 modules 17 active
● Mix █████████████████████████ building (10%) 0/3 entries 30/38 dependencies 4/20 modules 16 active
● Mix █████████████████████████ building (10%) 0/3 entries 46/50 dependencies 12/31 modules 17 active
● Mix █████████████████████████ building (28%) 1/3 entries 202/202 dependencies 66/85 modules 17 active
node_modules/@popperjs/core/lib/dom-utils/getClippingRect.js
(node:47002) UnhandledPromiseRejectionWarning: TypeError: Cannot destructure property 'service' of 'this._compiler.$tailwind' as it is undefined.
at Object.CssLoader (/Users/Silver/Projects/sample-ui/node_modules/tailwindcss-webpack-plugin/dist/loaders/css-loader.js:66:11)
at LOADER_EXECUTION (/Users/Silver/Projects/sample-ui/node_modules/loader-runner/lib/LoaderRunner.js:132:14)
at runSyncOrAsync (/Users/Silver/Projects/sample-ui/node_modules/loader-runner/lib/LoaderRunner.js:133:4)
at iterateNormalLoaders (/Users/Silver/Projects/sample-ui/node_modules/loader-runner/lib/LoaderRunner.js:251:2)
at /Users/Silver/Projects/sample-ui/node_modules/loader-runner/lib/LoaderRunner.js:224:4
at /Users/Silver/Projects/sample-ui/node_modules/webpack/lib/NormalModule.js:834:15
at Array.eval (eval at create (/Users/Silver/Projects/sample-ui/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:12:1)
at runCallbacks (/Users/Silver/Projects/sample-ui/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:27:15)
at /Users/Silver/Projects/sample-ui/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:200:4
at /Users/Silver/Projects/sample-ui/node_modules/graceful-fs/graceful-fs.js:123:16
(Use `node --trace-warnings ...` to show where the warning was created)
(node:47002) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
^C⏎
hi, thanks for your feedback. Could you please provide a repo to reproduce it, thanks a lot
@await-ovo thanks for response. here it is: https://github.com/pySilver/tailwindcss-webpack-plugin-bug
Hi @pySilver , This should be fixed in tailwindcss-webpack-plugin@0.0.7. You can see if there are still problems on your side.
@await-ovo thanks. Looks like its working now! :)
@await-ovo I was a little too fast. For some reason it wasn't working initially, then it after couple of browser reloads it clicked in but at the end it doesn't work. OK sounds like a mystery. What I'm seeing is bunch of empty classes injected into header. So devtools suggestions works but as classes are empty there is no useful outcome: https://share.cleanshot.com/nk3owO
@await-ovo I was a little too fast. For some reason it wasn't working initially, then it after couple of browser reloads it clicked in but at the end it doesn't work. OK sounds like a mystery. What I'm seeing is bunch of empty classes injected into header. So devtools suggestions works but as classes are empty there is no useful outcome: https://share.cleanshot.com/nk3owO
@pySilver Yeah, The empty classes is just for auto completion, it should generate a new class on demand when you changing class name in devtools. This is based on webpack HMR.
What I'm confused about is how HMR works in laravel-mix, After run yarn hot, i changed the content of src/js/app.js under the repository you provided, then the browser automatically reload, but the content is not up to date, is this also the case on your end?
Yes. Unfortunately it is. I've followed instructions posted here but still no luck: https://laravel-mix.com/docs/6.0/hot-module-replacement#basic-usage-in-laravel