Module not found: Error: Can't resolve 'style-loader!css-loader' | Webpack: Manipulando módulos na sua webapp

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

Referente ao curso Webpack: Manipulando módulos na sua webapp, no capítulo Tratando arquivos CSS como módulos e atividade Importando Bootstrap como um módulo

por Diogo Barbosa Silva Sousa

| 415.1k xp | 38 posts

Curso - Webpack: Manipulando módulos na sua webapp

Aula 4 - Tratando arquivos CSS como módulos

Atividade 03 -Importando Bootstrap como um módulo

Ocorreu esse erro abaixo mesmo tendo seguido todos os passos do vídeo estou usando a versão 10 do node.

ERROR in ./app-src/app.js
Module not found: Error: Can't resolve 'style-loader!css-loader' in 'C:\xampp\htdocs\projeto-webpack\client'
 @ ./app-src/app.js 3:0-42
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./app-src/app.js

ERROR in ./app-src/app.js
Module not found: Error: Can't resolve 'style-loader!css-loader' in 'C:\xampp\htdocs\projeto-webpack\client'
 @ ./app-src/app.js 4:0-48
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./app-src/app.js

2 respostas

por Diogo Barbosa Silva Sousa

| 415.1k xp | 38 posts

02/04/2019

Por favor antes de encerrarem o tópico só me expliquem porquê da forma que foi mostrada não funciona ou se tem alguma configuração que tenha que ser feita antes.

Solução que implementei.

Usando a sintaxe:

 { 
       test: /\.css$/,
       use: [ 'style-loader' , 'css-loader' ]
 },

ou essa que vi no site https://webpack.js.org/concepts/loaders/:

 {
          test: /\.css$/,
          use: [
                 // style-loader
                 { loader: 'style-loader' },
                 // css-loader
                 {
                      loader: 'css-loader',
                      options: {
                        modules: true
                      }
                 },
             ]
    },

Ao invés de:

 {
             test: /\.css$/,
             use: {
                   loader: 'style-loader!css-loader' 
            }
 },

solução!

por Matheus Henrique Castiglioni

| 5303.5k xp | 9004 posts

Instrutor Senior Software Engineer

02/04/2019

Fala aí Diogo, tudo bem? Bom, acredito ser um problema de versão do Webpack, no curso a versão utilizada é mais antiga (não lembro qual) e hoje já estamos na 4.29.6.

Espero ter ajudado.