Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Configuração de arquivos

Bom dia, ao subir o npm start, ele me retorna o seguinte erro:

ERROR in ./src/js/main.js
Module not found: Error: Can't resolve 'css' in 'C:\Users\wellington.gallo\Desktop\TodoList'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
                 You need to specify 'css-loader' instead of 'css',
                 see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed
 @ ./src/js/main.js 3:0-26
 @ multi babel-polyfill ./src/js/main

ERROR in ./src/js/main.js
Module not found: Error: Can't resolve 'css' in 'C:\Users\wellington.gallo\Desktop\TodoList'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
                 You need to specify 'css-loader' instead of 'css',
                 see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed
 @ ./src/js/main.js 5:0-31
 @ multi babel-polyfill ./src/js/main

ERROR in ./src/js/main.js
Module not found: Error: Can't resolve 'css' in 'C:\Users\wellington.gallo\Desktop\TodoList'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
                 You need to specify 'css-loader' instead of 'css',
                 see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed
 @ ./src/js/main.js 7:0-35
 @ multi babel-polyfill ./src/js/main

O arquvio main está da seguinte forma:

import '../css/main.css';
import '../css/bootstrap.css';
import '../css/bootstrap.min.css';

import {todos} from './state';
import {render} from './view';
import {registerEventHandlers} from './events';

todos.subscribe(newState => render(document.body, newState));

render(document.body, todos.getState());

registerEventHandlers();

Se eu comento os imports de css ele volta funcionar normal, mas perco todo style do css e do bootstrap. A minha configuração de webpack está assim:

var path = require('path');

const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: ['babel-polyfill', path.normalize(__dirname + '/src/js/main')],
    devtool: 'cheap-module-source-map',
    output: {
        filename: 'bundle.js',
        path: path.join(__dirname, 'dist')
    },
    module: {
        loaders: [
            {
                loader: 'babel-loader',
                test: /\.js$/,
                include: [path.resolve(__dirname, 'src', 'js')],
                query: {
                    plugins: ['transform-runtime'],
                    presets: ['es2015']
                }
            },
            {
                test: /\.css$/,
                loader: ExtractTextPlugin.
                    extract({
                        fallbackLoader: 'style-loader',
                        loader: 'style-loader!css'
                    }),
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin("src/css/styles.css"),
      ]
};

Veja que eu acrescentei os loaders conforme vi em foruns e documentação, ele precisa de mais alguma coisa para rodar o projeto perfeitamente?

FIco no aguardo

1 resposta
solução!

Resolvido

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software