Question

我正在尝试在使用服务器端渲染的create-react-app应用程序中进行一些代码拆分。

我正在利用'react-loadable`来进行代码分割：https://github.com/thejameskyle/react-loadable

截至目前，我只是将我的Home.js组件与我的应用程序的其余部分分开，只是为了查看它是否有效。在开发模式中（读取：不是SSR），它会被分解并正常工作。

但是，我无法在服务器上运行。我正在关注他们的Github页面上的指南，因为需要更改webpack而陷入困境。在create-react-app应用程序中，您无法访问webpack，因为它已隐藏起来。

启动服务器时收到的错误是：

return (0, _importInspector.report)(import('../components/home/Home'), {
                                                ^^^^^^
SyntaxError: Unexpected token import
at createScript (vm.js:80:10) ...

我很确定这是因为我没有像指南中所说的那样正确配置webpack。

在指南中，它明确指出了SSR：

首先，我们需要Webpack告诉我们每个模块所在的捆绑包。为此，有React Loadable Webpack插件。

从react-loadable / webpack导入ReactLoadablePlugin并将其包含在您的webpack配置中。传递一个文件名，用于存储有关我们捆绑包的JSON数据的位置。

// webpack.config.js
import { ReactLoadablePlugin } from 'react-loadable/webpack';

export default {
    plugins: [
        new ReactLoadablePlugin({
            filename: './dist/react-loadable.json',
        }),
    ],
};

如果没有弹出，我认为这是不可能的。任何人都知道react-loadable是否可以在create-react-app服务器端呈现的应用程序中使用？

Answer 1

将这些模块导入服务器文件的顶部

JsonFormat

可以在create-react-app服务器端使用可反应加载吗？

1 个答案: