（React Webpack）在開發模式下運行項目時，不會加載src文件夾下的文件

Question

我是React.js的新手。 我使用“ create-react-app”命令創建了項目。 我想添加服務器，所以彈出項目。 但是位於src文件夾下的文件不會出現在localhost：4000上。 我可以在index.html中看到內容。 我怎么了

這是我的package.json腳本

"scripts": {
    "development": "cross-env NODE_ENV=development nodemon --exec babel-node --presets=es2015 ./server/main.js --watch server"
}

這是webpack.dev.config.js

  var webpack = require('webpack');
    var path = require('path');

    module.exports = {

    entry: [
        'babel-polyfill',
        './src/index.js',
        'webpack-dev-server/client?http://0.0.0.0:4000',
        'webpack/hot/only-dev-server',
        './src/style.css'
    ],

    output: {
        path: '/',
        filename: 'bundle.js'
    },

    devServer: {
        hot: true,
        filename: 'bundle.js',
        publicPath: '/',
        historyApiFallback: true,
        contentBase: './public',
        proxy: {
            "*": "http://localhost:3000"
        }
    },

    plugins: [
        new webpack.HotModuleReplacementPlugin()
    ],

    resolve: {
      modules: [path.resolve("./src"), 'node_modules']
    },

    module: {
        loaders: [
            {
                test: /\.js$/,
                loaders: ['babel-loader?' + JSON.stringify({
                    cacheDirectory: true,
                    presets: ['es2015', 'react']
                })],
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            }
        ]
    }
};

Answer 1

webpack-dev-server只加載index.html的內容，因為它看不到捆綁文件bundle.js 。 在您的配置中，捆綁文件的目的地是目錄'/' 。

 output: {
        path: '/',
        filename: 'bundle.js'
    }

但是webpack-dev-server從'./public'目錄（ contentBase: './public' ）提供內容。 您應該告訴webpack這樣查看公共目錄和根目錄

devServer: {
        hot: true,
        filename: 'bundle.js',
        publicPath: '/',
        historyApiFallback: true,
        contentBase: ['/', '/public'],
        proxy: {
            "*": "http://localhost:3000"
        }
    }

不要忘記在index.html中引用捆綁文件。