1

Windows 10. I'm following the React + Webpack tutorial on https://robots.thoughtbot.com/setting-up-webpack-for-react-and-hot-module-replacement and stuck at the point where we should copy index.html from app/ folder to dist/ folder. Instead of copying right to /dist folder index.html is copied to dist/app/ folder. Could you please help?

Here is my webpack.config.js file

module.exports = {
    context: __dirname + "/app",
    entry: {
        javascript: "./app.jsx",
        html: "./index.html"
    },
    output: {
        filename: 'app.js',
        path: __dirname + "/dist",
        publicPath: __dirname + "/dist"
    },
    module: {
        loaders: [
      {
        test: /.jsx?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          presets: ['es2015', 'react']
        }
      },
      {
        test: /\.html$/,
        loader: 'file-loader?name=[name].[ext]'
      }
        ]
    }
};

Folder structure

├───app
│       app.jsx
│       greeting.jsx
│       index.html
│
└───dist

Thanks in advance!

trickbz
  • 945
  • 1
  • 9
  • 25

1 Answers1

1

In Windows OS path separator is \ not /.

So, you should use path.join to concat two parts of paths:

var path = require('path');

module.exports = {
    context: path.join(__dirname, "app"),
    ...
Bob Sponge
  • 4,708
  • 1
  • 23
  • 25