Trung tâm cá nhân
sách gpt4 ai đã đi

reactjs - 带有 React Hot Loader 的 Webpack 开发服务器

In lại 作者：行者123 更新时间：2023-12-04 17:57:25 27 4
mua khóa gpt4 Nike

我有一个本身就可以完美运行的 webpack 配置。我正在尝试按照建议将 React Hot Loader 与 HMR 安装在一起，这需要 webpack-dev-server。在这里我无法让它工作。我找不到我的包所在的位置。我希望它位于 localhost:3000.

của tôiwebpack.config.js:

var webpack = require('webpack');
var path = yêu cầu('đường dẫn');

module.exports = {
  watch: true,

  devtool: 'eval',

  // entry: './src/main.js', This runs just for webpack bundling

  entry:[
    'webpack-dev-server/client?http:localhost:9000', // WebpackDevServer host and port
    'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors
    './src/main.js' // Your appʼs entry point
  ],

  output: {
    path: path.resolve(__dirname, 'public', 'dist'),
    filename: 'main.js'/*,
    publicPath: '/dist/'*/
  },

  module: {
    loaders: [{
      test: /\.js$/,
      loaders: ['react-hot', 'babel-loader?cacheDirectory=true,presets[]=react,presets[]=es2015'],
      exclude: function(path) {
        var isModule = path.indexOf('node_modules') > -1;
        var isJsaudio = path.indexOf('jsaudio') > -1;

        if (isModule && !isJsaudio) {
          trả về giá trị đúng;
        }
      }
    }, {
      test: /\.json$/,
      loader: "json-loader"
    }]
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ],

  resolve: {
    extensions: ['', '.js', '.json', 'index.js'],
    root: [
      path.resolve(__dirname, 'src'),
      path.resolve(__dirname, 'node_modules'),
      path.resolve(__dirname, 'node_modules', 'jsaudio', 'src')
    ]
  },

  target: 'web',

  node: {
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  }
};

Và webpack-server.js:

var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
var config = require('./webpack.config');

new WebpackDevServer(webpack(config), {
    publicPath: '/dist/',
  hot: true,
  historyApiFallback: true
}).listen(9000, 'localhost', function (err, result) {
  if (err) {
    return console.log(err);
  }

  console.log('Listening at http://localhost:9000/');
});

更新:链接的问题没有帮助，尤其是因为它甚至没有确认的答案。

1 Câu trả lời

我建议尝试 react-hot-loader v3，因为使热重载工作的更新已经简化(在我看来!)。

在webpack中然后try点现在只需要:

entry: {
    app: [
        'react-hot-loader/patch',
        'webpack-hot-middleware/client',
        `${SRC}/client-entry.js`
    ]
}

这里是示例应用程序的链接，react-lego我为帮助人们而创建的 add react-hot-loader v3到他们的应用程序。希望对你有帮助

关于reactjs - 带有 React Hot Loader 的 Webpack 开发服务器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39225829/

27 4 0
Bài viết được đề xuất: spring-mvc - 带下划线的 Spring 引导路径变量不调用 Controller
Bài viết được đề xuất: shared - 如何使用 autoconf 制作 .so 库，而不是 .la 库？
Bài viết được đề xuất: emacs - 使用 ido.el 在 emacs 上使用 dired 复制粘贴各种文件
Bài viết được đề xuất: javascript - 检测浏览器和操作系统版本
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Các bài viết nóng hổi trên toàn bộ trang web
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com