in Dist is not added file with styles
package.json
{
"Name": "Jelly-Effect",
"Version": "1.0.0",
"Description": "Jelly Effect On Canvas",
"Main": "index.js",
"scripts": {
"Build": "WebPack --Mode Production",
"Watch": "WebPack-DeV-Server --Mode Development --Open"
},
"Author": "CreativeRusbear",
"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.0",
"Extract-Text-WebPack-Plugin": "^ 4.0.0-beta.0",
"PATH": "^ 0.12.7",
"WebPack": "^ 4.29.0",
"WebPack-CLI": "^ 3.2.1",
"WebPack-Dev-Server": "^ 3.1.14"
}
}
WebPack.config.js
Let Path = Require ('Path'),
ExtractTextPlugin = Require ('Extract-Text-WebPack-Plugin');
Let conf = {
entry: './src/js/script.js',
Output: {
Path: Path.Resolve (__ dirname, '. / dist / js'),
FileName: 'app.js',
PublicPath: 'DIST / JS /'
},
DevServer: {
Overlay: True.
},
Module: {
Rules: [
{
Test: /\.js$/,
Loader: 'Babel-Loader'
}, {
Test: /\.css$/,
Use: extracttextplugin.exTract ({
Use: 'CSS-Loader'
})
}
]
},
Plugins: [
New ExtractTextPlugin ('CSS / Styles.css'),
]
};
module.exports = (ENV, OPTIONS) = & gt; {
Let Prod = Options.mode === 'Production';
conf.devtool = PROD? 'Source-Map': 'Eval-Sourcemap';
RETURN CONF;
};
Answer 1
In general, the problem was in the CSS-Loader version (you need to put v.0.28.11)
So you throw link on your Gist, which contains a ready-made pattern.