Question

我正在尝试渲染我的应用程序服务器端，并且它不断抛出每个Sass规则。

尝试添加服务器Webpack配置：

const serverConfig = {
  name: 'server',
  devtool: 'eval-source-map',
  entry: [
    './lib/server/helpers/serverRender'
  ],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'serverRender.js',
    publicPath: '/static/'
  },
  module: {
    loaders: [
      {
        test: /\.js?/,
        loader: 'babel-loader',
        include: path.join(__dirname, 'lib/server')
      },
      {
        test: /\.scss$/,
        loader: 'isomorphic-style-loader!css-loader!sass-loader'
      },
      {
        test: /\.(eot|svg|ttf|woff|woff2)$/,
        loader: 'file-loader'
      },
      {
        test: /\.(jpe?g|png|gif)$/i,
        loader: 'file-loader'
      }
    ]
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin()
  ]
};

这是我的服务器渲染器：

import React from 'react';
import ReactDOMServer from 'react-dom/server';
// import App from '../../src/index';

const serverRender = async () => {
  return ReactDOMServer.renderToString(<div>Loading...</div>);
};

export default serverRender;

这是我的服务器代码，我通过Express渲染它：

import serverRender from '../helpers/serverRender';
app.get('*', async (req, res) => {
  const initialMarkup = await serverRender();
  res.render('../index.ejs', { initialMarkup });
});

这似乎有效，但是当我在服务器渲染器中取消注释导入的App文件时，它会对Sass样式大喊大叫。

我尝试在/ static /中包含serverRender.js文件，但似乎无法找到模块。

我做错了什么???

使用React Server呈现包含CSS模块的麻烦

0 个答案: