For those who are having problems in implementing it in 2020 and getting an exclamation mark error, use separate objects for style-loader and css-loader like following: { test: /\.css$/, loader: 'style-loader' }, { test: /\.css$/, loader: 'css-loader' }
I'm getting this error when I tried to command out 'webpack' after 6:00 Please help ninja! ERROR in ./src/css/introComponent.css Module build failed: TypeError: loaderUtils.getOptions is not a function at Object.module.exports.pitch (C:\Users\ASUS\Desktop\Webpack\webpack-playlist ode_mo dules\style-loader\index.js:10:26) @ ./src/script-1.js 4:0-35
Thanks :). I go for one with an active community --> a lot of people are using Atom and making decent packages to improve it. Plus, it looks nice :). I stopped using Brackets because it seemed a little dead in terms of updates and releases.
Question - why didn't you exclude node_modules in the css loader portion of your webpack config? Does this only need to be specified once, or did you not add it because there wouldn't be any css files in the node_modules folder?
#help i'm getting error like this, Do you have any ideas???? Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.module has an unknown property 'loaders'. These properties are valid: object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, defaultRules?, unkn ownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wr appedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? } -> Options affecting the normal modules (`NormalModuleFactory`).
in May, 2020, it works perfectly well, but, I did "npm install node-sass" and the order in the 'loader is the most important" so it will be, { test:/\.css$/, loader:'style-loader!css-loader' } thanks
For those who are having problems in implementing it in 2020 and getting an exclamation mark error, use separate objects for style-loader and css-loader like following:
{
test: /\.css$/,
loader: 'style-loader'
},
{
test: /\.css$/,
loader: 'css-loader'
}
Thank you so much! I'm starting the development about how to load CSS inside React components, but I just discovered with this video. Thanks!
Funny how much sense a 7 min video can make after reading pages and pages of docs and not getting the simple questions answered.
I want to load CSS in webpack using typescript. So, I have to CSS folder on ".ts" file or How can I import.?
Please tell me asap
Thank you
I'm getting this error when I tried to command out 'webpack' after 6:00
Please help ninja!
ERROR in ./src/css/introComponent.css
Module build failed: TypeError: loaderUtils.getOptions is not a function
at Object.module.exports.pitch (C:\Users\ASUS\Desktop\Webpack\webpack-playlist
ode_mo
dules\style-loader\index.js:10:26)
@ ./src/script-1.js 4:0-35
For me I had to go to the file it specified and changed the getOptions() function to parseQuery() and it worked
Hope this helps.
`npm install --save-dev loader-utils` solved the problem
why not use a monospace font in the editor? why???
Hey Shaun, great choise about the Atom, you can clearly seen it even on smaller screens.
Will you consider React Native to teach?
Hey, yeah, will be doing a series on this in the future :)
can you use php if using node? or would a dev use js and say mongoDB.. ? do you go with one or the other or mix it up for backend tasks? thx
How to add CSS assets like background-image url with the css file in webpack4?
Great tutorials!
What criteria do you use to select the text editor? I saw you using Brackets, Atom, etc.
Thanks :). I go for one with an active community --> a lot of people are using Atom and making decent packages to improve it. Plus, it looks nice :). I stopped using Brackets because it seemed a little dead in terms of updates and releases.
Thanks a lot for the video, it helped me use css and scss files in my webpack app.
Question - why didn't you exclude node_modules in the css loader portion of your webpack config? Does this only need to be specified once, or did you not add it because there wouldn't be any css files in the node_modules folder?
He is only excluding node_modules from being parsed with babel-loader (, but not from being bundled.) You must specify it for css-loader again.
thanks for new series
hey Shaun !
will you make a MEAN stack app series ?
Hey - I will be doing this fairly soon, yeah :)
Can't wait.
Thanks from Syria
Great lesson, thanks!
#help
i'm getting error like this, Do you have any ideas????
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'loaders'. These properties are valid:
object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, defaultRules?, unkn
ownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wr
appedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? }
-> Options affecting the normal modules (`NormalModuleFactory`).
Yeah. Some things have changed in the Webpack 4. (including the way to create config files) I will give my updated file below. I hope that helps!
Really helpful!
Awesome! Thanks!!
I am so so sorry that I messed up with your repo files in git. I was trying to install webpack and babel, I think I used "git audit --force".
xD
Great
I think you should update this series.
Cool
10x m8 you've saved me life! :)
You kinda sound like Korg from Thor Ragnarok :)
in May, 2020, it works perfectly well, but,
I did "npm install node-sass" and the order in the 'loader is the most important" so it will be,
{
test:/\.css$/,
loader:'style-loader!css-loader'
}
thanks
f**k webpacks!!!