1

我正在使用类似于 - https://github.com/ayroblu/ssr-create-react-app-v2的设置以及 sass 预处理。

现在，使用 ignore-styles 包在服务器端忽略了样式 -

// Ignore those pesky styles
require('ignore-styles');
// require('babel-polyfill');
// Set up babel to do its thing... env for the latest toys, react-app 
for CRA
require('babel-register')({
   ignore: /\/(build|node_modules)\//,
   presets: ['env', 'react-app'],
   plugins: [
     'syntax-dynamic-import',
     'dynamic-import-node',
     'react-loadable/babel'
   ]
});

但是，在我们使用过类似代码的组件中 -

import style from './style.scss';
<div className={cx('align-center', style['center'])}></div>

通过样式变量引用的类名不会在服务器端呈现（因为忽略样式），但在前端可以正常工作。

我们如何确保类名在不破坏服务器端渲染的情况下完美运行？

4

0 回答 0