【问题标题】:Remove server from react-boilerplate从反应样板中删除服务器
【发布时间】:2018-10-30 14:06:21
【问题描述】:

应该如何从 react-boilerplate 中删除服务器文件夹?另一个人https://github.com/react-boilerplate/react-boilerplate/issues/2110在这里也提出了问题。

【问题讨论】:

  • 为什么要移除服务器?
  • @DineshPandiyan 我用 koa 代替 express。
  • react-boilerplate 与 express 中的热重载中间件高度集成。您最好使用新的 create-react-app 弹出来重新设置。
  • @DineshPandiyan 好的...好吧,我自己修好了...

标签: react-boilerplate


【解决方案1】:

仅删除服务器文件夹将不起作用,因为 webpack 开发配置正在利用它进行热重载,并且您的 npm start 命令从该文件夹启动快速服务器。

如果您想完全删除服务器文件夹,但仍希望应用程序像热重载等一样正常工作,请按照以下步骤操作。在这种情况下,我们将需要 webpack 开发服务器:

  • 手动删除./server 文件夹。
  • 安装 webpack-dev-serverreact-hot-loader 作为开发依赖项。
  • 在您的./internals/webpack/webpack.dev.babel.js 中,进行以下修改:

    • 将条目更改为:

      entry: [
            require.resolve('react-app-polyfill/ie11'),
            'react-hot-loader/patch',
            `webpack-dev-server/client?http://localhost:3000/`,
            'webpack/hot/only-dev-server',
            path.join(process.cwd(), 'app/app.js'), // Start with js/app.js
      ],
      
    • 在输出中添加 publicPath:

      output: {
          filename: '[name].js',
          chunkFilename: '[name].chunk.js',
          publicPath: `http://localhost:3000/`,
      },
      
    • 在同一个文件中添加 webpack 开发服务器配置属性:

      devServer: {
         port: 3000,
         publicPath: `http://localhost:3000/`,
         compress: true,
         noInfo: false,
         stats: 'errors-only',
         inline: true,
         lazy: false,
         hot: true,
         open: true,
         overlay: true,
         headers: { 'Access-Control-Allow-Origin': '*' },
         contentBase: path.join(__dirname, '..', '..', 'app', 'build'),
         watchOptions: {
             aggregateTimeout: 300,
             ignored: /node_modules/,
             poll: 100,
         },
         historyApiFallback: {
             verbose: true,
             disableDotRule: false,
         },
      },
      
    • ./internals/webpack/webpack.base.babel.js 中,添加以下行:

      devServer: options.devServer,
      

最后,修改package.json 中的启动脚本,如下所示:

"start": "cross-env NODE_ENV=development node --trace-warnings ./node_modules/webpack-dev-server/bin/webpack-dev-server --color --config internals/webpack/webpack.dev.babel.js",

你很高兴!

【讨论】:

    【解决方案2】:

    如果您感到受到骚扰,请使用 rm -rf ./server 删除 :)

    【讨论】:

    • Raguzzini 哈哈好吧..但是如何调整webpack不使用服务器文件夹?
    • webpack 中唯一的 refs 是关于开发 webpack 配置中的 logger,删除它们就可以了 :)
    • Raguzzina 你是什么意思?在https://github.com/react-boilerplate/react-boilerplate/blob/master/internals/webpack/webpack.dev.babel.js 中找不到任何关于 logger 的信息
    • 我在旧版本的样板中寻找它。在新的 webpack 中,根本不使用 /server 脚本
    • 啊,好吧!你也使用 react-boilerplate 吗?
    猜你喜欢
    • 1970-01-01
    • 2017-07-11
    • 2018-10-30
    • 2014-11-06
    • 1970-01-01
    • 1970-01-01
    • 2013-02-10
    • 2015-11-08
    • 1970-01-01
    相关资源
    最近更新 更多