[email protected]: "Module parse failed. You may need an appropriate loader to handle this file type" - though using css-loader and style-loader
Please look at your regex for matching. It is wrong. It should be:
/\.css$/
for css
/\.js$/
for js
Your backslash is at the wrong position. Your regex matches files named: style\css
Imran
Updated on July 09, 2022Comments
-
Imran almost 2 years
Below is my webpack.config.js and the package.json
module.exports = { entry: "./entry.js", output: { filename: "./build/js/bundle.js" }, module: { rules: [ { test: /.\js$/, use: [ { loader: 'babel-loader', options: { presets: ["es2015"] } } ] }, { test: /.\css?$/, include: __dirname + "./src/css", exclude: __dirname + "./src/js", use: [ 'style-loader', { loader: 'css-loader', options: { modules: true } } ] } ] }, plugins: [ // new UglifyJsPlugin() ] } "dependencies": { "ajv-keywords": "^3.1.0", "ajv": "^6.0.0", "axios": "^0.17.1", "babel-minify-webpack-plugin": "^0.3.0", "extract-text-webpack-plugin": "^3.0.2", "install": "^0.10.4", "npm": "^5.6.0" }, "devDependencies": { "babel-core": "^6.26.0", "babel-loader": "^7.1.3", "babel-preset-es2015": "^6.24.1", "css-loader": "^0.28.10", "style-loader": "^0.20.2", "webpack": "^4.0.0" },
Below is the error
ERROR in ./src/css/autosuggest-style.css Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type. | .ngCustomInput *, *:before, *:after { |
-moz-box-sizing: border-box; | -webkit-box-sizing: border-box; @ ./entry.js 20:0-42ERROR in ./src/css/newUiStyles.css Module parse failed: Unexpected token (1:4) You may need an appropriate loader to handle this file type. | body{ | background-color: #F2F2F2; | font-family: sans-serif; @ ./entry.js 3:0-36 ERROR in ./src/css/custom-style.css Module parse failed: Unexpected token (2:0) You may need an appropriate loader to handle this file type. | /* Styles go here */ | .border | { | border:1px solid transparent; @ ./entry.js 21:0-37
Not sure what error is....
Thanks in advance for help