可以在create-react-app服务器端使用反应加载吗？-Java 学习之路

我试图在我的create-react-app应用程序中使用服务器端呈现进行一些代码拆分 .

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

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

但是，我可以't get things to work on the server. I' m跟随他们的Github页面上的指南，因为需要更改webpack而被卡住了 . 在 create-react-app 应用程序中，您隐藏着't have access to webpack as it' .

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

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 服务器端呈现的应用程序？

1 回答

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

require('ignore-styles');
require('babel-polyfill')
require('babel-register')({
    ignore: [ /(node_modules)/ ],
    presets: ['es2015', 'react-app'],
    plugins: [
        'syntax-dynamic-import',
        'dynamic-import-node',
        'react-loadable/babel'
    ]
});

回复于 2024-05-03T13:12:21+08:00

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

1 回答

相关问题