Question

我具有以下目录结构：

->React Coursera
->...
->webpack.config.js

我的整个React应用程序都位于React Coursera文件夹中，并在其中有一个带代码的index.html文件


<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
</head>
<body>
    <div id="root"></div>
</body>
<script src="./index_bundle.js"></script>
</html>

以下是webpack配置文件：

var path = require('path');
var nodeExternals = require('webpack-node-externals');
var LodashModuleReplacementPlugin = require('lodash-webpack-plugin');
var webpack=require('webpack');

var isProduction = process.env.NODE_ENV === 'production';
var productionPluginDefine = isProduction ? [
  new webpack.DefinePlugin({'process.env': {'NODE_ENV': JSON.stringify('production')}})
] : [];
module.exports = {
    entry : './React Coursera/index.js',
    output : {
        path : path.resolve(__dirname , 'React Coursera'),
        filename: 'index_bundle.js'
    },

    module : {
        rules : [
            {test : /\.(js)$/, exclude: path.resolve(__dirname,"node_modules"),use:'babel-loader'},
            {test : /\.css$/, use:['style-loader', 'css-loader']},
        { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader" },
        { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader" }
        ]
    },
    devServer:{
      publicPath: '/React Coursera',
      contentBase: './React Coursera'
    },
plugins:productionPluginDefine

};

我希望在命中localhost：8080时打开index.html。我已经在devServer中尝试了几乎所有可能的配置，但是控制台始终会打印错误，指出找不到index_bundle.js。

请帮助我查找配置中的任何问题。

谢谢！

无法从其他目录运行webpack-dev-server

0 个答案: