I have React app with structure like this:
├── components
│ ├── app
│ │ └── App.js
│ ├── grid
│ │ ├── Cell.js
│ │ ├── Grid.js
│ │ └── Row.js
│ └── navbar
│ └── Navbar.js
├── store
│ ├── apartments.js
│ ├── api.js
│ ├── index.js
│ └── orders.js
├── index.js
├── routes.js
when I change something in one of my components files webpack won't compile. But when I change files in "store" folder or index.js
it'll compile successfully
Here the my config file:
var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
bundle: './src/index.js'
},
output: {
path: __dirname,
filename: "bundle.js"
},
module: {
rules: [
{
use: 'babel-loader',
test: /\.js$/,
exclude: /node_modules/
},
{
use: ['style-loader', 'css-loader'],
test: /\.css$/
}
]
}
};
I tried run webpack-dev-server
with --hot
flag.
Also installed case-sensitive-paths-webpack-plugin
Specified contentBase : __dirname
in dev-server config
it is all didn't help me
My webpack version: 2.6.1
, webpack-dev-server: 2.4.5
But sometimes it is just work and I can't understand why, it is some sort of magic for me. It can work after renaming files and folders or it worked after case-sensitive-paths-webpack-plugin
instalation but then stop again.
Please can someone at least explain how I can debug this. I googled problem for two days and didn't find any solution.