search

glook / webpack-typescript-react

Webpack 5 boilerplate with support of most common loaders and modules (see tags and description)
MIT License
218 stars 54 forks source link

Build error when using css. #16

Closed haydermabood closed 2 years ago

haydermabood commented 2 years ago

Hello, I am getting the following error when I try to add a css file to the vanilla project:

ERROR in ../src/styles/styles.css (../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].use[1]!../node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].use[2]!../node_modules/css-loader/dist/cjs.js!../src/styles/styles.css) Module build failed (from ../node_modules/resolve-url-loader/index.js): Error: resolve-url-loader: error processing CSS .../src/styles/styles.css:1:1: Unknown word at Input.error (.../sample-project/node_modules/resolve-url-loader/node_modules/postcss/lib/input.es6:108:16) at encodeError (.../sample-project/node_modules/resolve-url-loader/index.js:287:12) at onFailure (.../sample-project/node_modules/resolve-url-loader/index.js:228:14) @ ../src/styles/styles.css 8:20-236 61:4-82:5 64:18-234 @ ../src/index.tsx 8:0-28

DeDaawg65 commented 2 years ago

I too am getting this error when trying to bring in third party library i.e. react-toastify (its not the only one just an example)

ERROR in ../node_modules/react-toastify/dist/ReactToastify.min.css (../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].use[1]!../node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].use[2]!../node_modules/style-loader/dist/cjs.js!../node_modules/css-loader/dist/cjs.js!../node_modules/react-toastify/dist/ReactToastify.min.css) Module build failed (from ../node_modules/resolve-url-loader/index.js): Error: resolve-url-loader: error processing CSS file://C:\Projects\Dennis\APPLICATION.UI.REACT\node_modules\react-toastify\dist\ReactToastify.min.css:2:7: Unknown word at Input.error (C:\Projects\Dennis\APPLICATION.UI.REACT\node_modules\resolve-url-loader\node_modules\postcss\lib\input.es6:108:16) at encodeError (C:\Projects\Dennis\APPLICATION.UI.REACT\node_modules\resolve-url-loader\index.js:287:12) at onFailure (C:\Projects\Dennis\APPLICATION.UI.REACT\node_modules\resolve-url-loader\index.js:228:14) @ ../node_modules/react-toastify/dist/ReactToastify.min.css 8:20-239 61:4-82:5 64:18-237 @ ../src/pages/App/App.tsx 4:0-51 @ ../src/pages/index.tsx 3:0-26 3:0-26 @ ../src/index.tsx 8:0-29 11:88-91

Any help would be greatly appreciated.

glook commented 2 years ago

@haydermabood @DeDaawg65 Hi, thank you for this issue request. It was fixed in 1.0.7

DeDaawg65 commented 2 years ago

Thank you so much for the fix, awesome work!

From: Andrey Polyakov @.> Sent: Monday, January 10, 2022 3:02 AM To: glook/webpack-typescript-react @.> Cc: DeDaawg65 @.>; Mention @.> Subject: Re: [glook/webpack-typescript-react] Build error when using css. (Issue #16)

Closed #16 https://github.com/glook/webpack-typescript-react/issues/16 .

— Reply to this email directly, view it on GitHub https://github.com/glook/webpack-typescript-react/issues/16#event-5864020931 , or unsubscribe https://github.com/notifications/unsubscribe-auth/AQ2XP44XBPVQ2PQDXDEM54LUVKG73ANCNFSM5KNZWW5A . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub . You are receiving this because you were mentioned. https://github.com/notifications/beacon/AQ2XP4ZVLTAEBTKKIIEIN2DUVKG73A5CNFSM5KNZWW5KYY3PNVWWK3TUL52HS4DFWZEXG43VMVCXMZLOORHG65DJMZUWGYLUNFXW5KTDN5WW2ZLOORPWSZGPAAAAAAK5QXN4G.gif Message ID: @. @.> >