Skip to content
This repository has been archived by the owner on Oct 30, 2020. It is now read-only.

Module build failed error #89

Open
Webbrother opened this issue Feb 2, 2019 · 9 comments
Open

Module build failed error #89

Webbrother opened this issue Feb 2, 2019 · 9 comments

Comments

@Webbrother
Copy link

I'm trying to use this loader but I get an error.

Uncaught Error: Module build failed (from ./node_modules/typings-for-css-modules-loader/lib/index.js):
Error: Cannot find module 'css-loader/locals'
    at Function.Module._resolveFilename (:9000/internal/modules/cjs/loader.js:611)
    at Function.Module._load (:9000/internal/modules/cjs/loader.js:537)
    at Module.require (:9000/internal/modules/cjs/loader.js:665)
    at require (:9000/internal/modules/cjs/helpers.js:20)
    at Object.<anonymous> (:9000/Users/Vega/projects/frontend-environment/client/node_modules/typings-for-css-modules-loader/lib/index.js:9)
    at Module._compile (:9000/internal/modules/cjs/loader.js:736)
    at Object.Module._extensions..js (:9000/internal/modules/cjs/loader.js:747)
    at Module.load (:9000/internal/modules/cjs/loader.js:628)
    at tryModuleLoad (:9000/internal/modules/cjs/loader.js:568)
    at Function.Module._load (:9000/internal/modules/cjs/loader.js:560)
    at Object../node_modules/typings-for-css-modules-loader/lib/index.js?!./src/css/index.css (bootstrap:151)
    at __webpack_require__ (bootstrap:78)
    at Object../src/css/index.css (index.css:2)
    at __webpack_require__ (bootstrap:78)
    at Module../src/index.ts (index.ts:1)
    at __webpack_require__ (bootstrap:78)
    at Object.0 (module1.ts:11)
    at __webpack_require__ (bootstrap:78)
    at checkDeferredModules (bootstrap:45)
    at bootstrap:151

My webpack config:

var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');

let distPath = path.resolve(__dirname, 'dist');

module.exports = {
    entry: './src/index.ts',
    output: {
        path: distPath,
        chunkFilename: '[name]-[contenthash].chunk.js',
        filename: '[name]-[contenthash].js'
    },
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                query: {
                    presets: ['@babel/env']
                },
                exclude: [/node_modules/]
            }
            , {
                test: /\.(html)$/,
                use: [{
                    loader: 'html-loader',
                    options: {
                        attrs: false
                    }
                }]
            }
            , {
                test: /\.(jpg|jpeg|png|gif)$/,
                use: [{
                    loader: 'url-loader',
                    options: {
                        limit: 1,
                        name: `img/[name]-[hash].[ext]`
                    }
                }]
            }, {
                test: /\.css$/,
                use: [
                    {
                        loader: "style-loader"
                    }, {
                        loader: 'typings-for-css-modules-loader',
                        options: {
                            modules: true,
                            namedExport: true,
                            camelCase: true
                        }
                    }
                ]
            }
        ]
    },
    resolve: {
        extensions: [ '.tsx', '.ts', '.js', ',css', '*' ]
    },
    stats: {
        colors: true
    },
    devtool: 'inline-source-map',
    devServer: {
        host: '0.0.0.0',
        port: 9000,
        open: true
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './index.html'
        }),
        new CleanWebpackPlugin(['dist'])
    ],
    optimization: {
        usedExports: true,
        splitChunks: {
            chunks: 'all',
            minSize: 1,
            name: true
        }
    }
};

What do I do wrong?

@pati1892
Copy link

pati1892 commented Feb 5, 2019

Hi,
had the same problem. Downgrad css-load to version 1.0.1 works fine for me.

@lski
Copy link

lski commented Feb 7, 2019

I believe this is because of a breaking change in css-loader. As @pati1892 says downgrading css-loader to 1.0.1 for now works.

@krailler
Copy link

I have the same problem. Downgrade css-loader to 1.0.1 works fine, but is planning any upgrade version of this package to support new versions of css-loader?

@thepedroferrari
Copy link

Downgrading to "css-loader": "^1.0.1" worked for me as well.

@Cryrivers
Copy link

any plan to support css-loader 2.0?

@daydayhappychao
Copy link

same problem, you need to use lower version css-loader

@Lemaro86
Copy link

This is not issue of css-loader, this is issue of current module.

@nortonwong
Copy link

nortonwong commented Aug 28, 2019

@DanNSam forked this repo to @teamsupercell/typings-for-css-modules-loader and updated it. See issue #94.

@nortonwong
Copy link

There are also other forks in the comments of #81.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants