小编Sat*_*ani的帖子

React SSR:防止客户端呈现在服务器上呈现的组件

我是 React 的新手。我正在构建一个带有 react、react router4、react redux 等的站点,其中很少有组件在服务器上呈现(主要是使用 API 调用获取数据并显示它们)。现在我的问题是,如果我在服务器上呈现组件并将呈现的 HTML 发送到客户端,它会再次在客户端上呈现(进行 API 调用),我需要阻止这种情况。

如果组件已经在服务器上呈现,我不想再次呈现它。我怎样才能做到这一点?

谢谢

萨蒂什

reactjs server-side-rendering react-redux react-router-v4

6
推荐指数
1
解决办法
2697
查看次数

React + SSR + Webpack +节点,意外令牌?PNG

我让webapp与在节点服务器上运行的服务器端呈现功能发生反应。我正在使用资产目录中的本地图像(如下所示:

<img src={require('../../../assets/img/image.png')} width="400" />
Run Code Online (Sandbox Code Playgroud)

在客户端运行良好,但在服务器端,节点尝试读取图像文件的内容并抛出以下提到的错误。

(function (exports, require, module, __filename, __dirname) { ?PNG
SyntaxError: Invalid or unexpected token
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:152:10)
    at Module._compile (module.js:605:28)
    at Object.Module._extensions..js (module.js:652:10)
    at Module.load (module.js:560:32)
    at tryModuleLoad (module.js:503:12)
    at Function.Module._load (module.js:495:3)
    at Module.require (module.js:585:17)
    at require (internal/module.js:11:18)
Run Code Online (Sandbox Code Playgroud)

我试过使用文件加载器,URL加载器,但没有任何效果。用于文件加载器的webpack配置:

module: {
    rules: [
    {
        test: /\.jsx?$/,
        use: 'babel-loader',
        exclude: /node_modules/
    },
    {
        test: /\.(png|jpg|gif)$/,
        use: [
        {
            loader: 'file-loader',
            options: {}
        }
        ]
    }
    ]
},
Run Code Online (Sandbox Code Playgroud)

谁能让我知道这里的问题。或者,除了之外,还有其他任何方法可以使用本地图像吗require()?任何帮助,将不胜感激。

谢谢〜Satish

urlloader reactjs webpack webpack-file-loader ssr

6
推荐指数
0
解决办法
293
查看次数