Конфигурация Webpack 4 не выбирает файл index.js - PullRequest
0 голосов
/ 12 июня 2018

Я делаю что-то глупое здесь.Я использую Webpack 4 и пытаюсь запустить приложение React.

Я получаю html-файл, но webpack не показывает содержимое файла index.js в браузере.Я проверил продукт.build & содержит действительно код компонента <hello />, однако он не отображается в браузере (и не показывает console.log, выполненный в index.js).

Структура каталогов:

enter image description here

webpack.config.js:

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const baseConfig = {
   context: path.resolve(__dirname, "src"),
   entry: "./index.js",
   output: {
      path: path.resolve(__dirname, "build"),
      publicPath: "/",
      filename: "[name].js"
   },
   module: {
      rules: [
         {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: "babel-loader"
         }
      ]
   },
   plugins: [
      new HtmlWebpackPlugin({
         template: "./index.html",
         filename: "../build/index.html",
      })
   ]
};

const devConfig = {
   mode: "development",
   devtool: "source-map",
   devServer: {
      historyApiFallback: true,
      hot: true,
      compress: false,
      port: 1111,
      publicPath: "http://localhost:1111/"
   }
};
module.exports = (env, argv) => {
   if (argv.mode === "development") {
      return merge(baseConfig, devConfig);
   }
   return merge(baseConfig, prodConfig);
};

index.js:

import React from "react";
import { render } from "react-dom";
import { Provider } from "react-redux";
import store from "./store";
import Hello from "./components/Hello"; // temp

const initialiseApp = () => {
   const appContainer = document.getElementById("app");
   console.log("hello");
   render(
      <Provider store={store}>
         <Hello />
      </Provider>,
      appContainer
   );
};

initialiseApp();

Спасибо,

...