Decided to migrate from the webpack galp, and faced with such a situation, it seems to follow from the official site!
package.json
{ "name": "my-webpack", "version": "1.0.0", "description": "", "scripts": { "start": "webpack-dev-server --mode development --open opera", "build": "webpack --mode production" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.26.3", "babel-loader": "^7.1.5", "babel-preset-env": "^1.7.0", "babel-preset-stage-3": "^6.24.1", "css-loader": "^2.1.1", "path": "^0.12.7", "style-loader": "^0.23.1", "webpack": "^4.31.0", "webpack-cli": "^3.3.2", "webpack-dev-server": "^3.3.1" }, "dependencies": { "jquery": "^3.4.1" } } index.js
import $ from "jquery"; import './styles.css'; Summary:
When I turn off the import './styles.css'; file import './styles.css'; then webpack run build builds correctly, but as soon as I plug back in styles.css , I styles.css this error
$ npm run build > my-webpack@1.0.0 build C:\my projects\my-webpack > webpack --mode production Hash: b131afefae160f98c63a Version: webpack 4.31.0 Time: 8171ms Built at: 2019-05-11 15:19:49 1 asset Entrypoint main = main.js [0] ./src/index.js 219 bytes {0} [built] [2] (webpack)/buildin/module.js 521 bytes {0} [built] [3] ./src/styles.css 279 bytes {0} [built] [failed] [1 error] + 1 hidden module ERROR in ./src/styles.css Module build failed (from ./node_modules/css-loader/dist/cjs.js): CssSyntaxError (2:1) Unknown word 1 | > 2 | var content = require("!!./styles.css"); | ^ 3 | 4 | if(typeof content === 'string') content = [[module.id, content, '']]; @ ./src/index.js 7:0-23 npm ERR! code ELIFECYCLE npm ERR! errno 2 npm ERR! my-webpack@1.0.0 build: `webpack --mode production` npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the my-webpack@1.0.0 build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. webpack.config.js
const path = require('path'); const conf = { entry: './src/index.js', output: { filename: 'main.js', path: path.resolve(__dirname, './dist/'), publicPath: '/dist' }, devServer: { 'overlay': true }, module: { rules:[ { test: /\.js$/, loader: 'babel-loader' }, { test: /\.css$/, use: ['css-loader', 'style-loader'] } ] } }; module.exports = conf; Project structure 
