In my public folder I have index.html, the css file and the fonts.In my source folder I have the index.js file.
This is how the folder structure looks
I have setup the webpack.config.js file like this
const path = require('path');const HtmlWebpackPlugin = require('html-webpack-plugin');module.exports = { entry: path.join(__dirname, 'src', 'index.js'), output: { path: path.resolve(__dirname, 'dist'), publicPath: '', filename: 'bundle.js', }, mode: 'development', module: { rules: [ { test: /\.?js$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { presets: ['@babel/preset-env', '@babel/preset-react'], plugins: ['@babel/transform-runtime'], }, }, }, { test: /\.css$/i, exclude: /node_modules/, use: ['style-loader', 'css-loader'], }, { test: /\.(png|jp(e*)g|svg|gif)$/, exclude: /node_modules/, use: 'file-loader', }, { test: /\.(woff|woff2|eot|ttf|otf)$/i, exclude: /node_modules/, use: 'url-loader', }, ], }, plugins: [ new HtmlWebpackPlugin({ template: path.join(__dirname, 'public', 'index.html'), publicPath: './', }), ],};
Everything is working fine in dev, but when I create the build the files inside the public folder except the index.html are not included.