11

我是 webpack 的新手,在尝试设置 webpack 时遇到了一些问题。

我有以下目录结构:

  • 节点模块
  • 公共(index.html、index.jsx)
  • 成分
  • webpack.config.js

在 index.html 我试图包括

<script src="../node_modules/react/dist/react-with-addons.js"></script>

当我尝试运行 webpack 开发服务器控制台时,它正在向我展示

http://localhost:8080/node_modules/react/dist/react-with-addons.js not found

以下是我的 webpack.config.js 文件:

module.exports = {
    //This is the entry point for the webpack
    entry: {
    app: ['./public/index.jsx']
    },
    output: {
    // This is the name of the bundle which is created  when webpack runs
    path: './public',
    filename: 'bundle.js' 
    },
    module: {
        loaders: [
            {
                //tell webpack to use jsx-loader for all *.jsx files
                test: /\.jsx$/,
                loader: 'jsx-loader?insertPragma=React.DOM&harmony'
            }
        ]
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    }
}
4

1 回答 1

13

我知道这是一个相当老的问题,但我今天在这个问题上遇到了困难。

我正在使用的解决方案是将数组传递给contentBasewith node_modules

devServer: {
    contentBase: [
      path.resolve(__dirname, "public"),
      path.resolve(__dirname, "node_modules")
    ],
    publicPath:  "/"
}

然后在你的html中:

<script src="./react/dist/react.js"></script>

这样你就不需要在你的包中包含 React,它可以被浏览器缓存。

于 2017-04-24T12:04:59.227 回答