TSX出现警告警告，但JS不发生

Question

我收到此警告：

[FLUSH CHUNKS]: Unable to find styles/localhost-theme-css in Webpack chunks. Please check usage of Babel plugin.

以下代码会引发警告（用于设置react-universal-component，该操作通过代码拆分进行服务器端渲染，该代码拆分仅读取用户正在读取的页面和域的必要CSS文件）：] >

export default (props) => {
  if (props.site !== undefined) {
    import(`../styles/${props.site}/theme.css`);
  }
上面的代码在Routes.tsx

中，整个文件看起来像：

import React from "react"
import universal from "react-universal-component"
import { Switch } from "react-router"

const determineHowToLoad = ({ page }) => {
  if (typeof page !== 'string') {
    return page();
  } else {
    return import(`./${page}`);
  }
}

const UniversalComponent = universal(determineHowToLoad, {
  loadingTransition: false
})

export default (props) => {
  if (props.site !== undefined) {
    import(`../styles/${props.site}/theme.css`);
  }

  return (
    <div>
      Test
    </div>
  )
}
但是，仅当文件名是Routes.tsx时，才会发生这种情况。 如果更改为Routes.js，则不会发生警告。

即使警告和文件名是Routes.tsx，所有情况看起来都很好，但仅在控制台终端中出现警告。

我的Webpack设置：

1。 webpack.dev-client.js：

optimization: {
    splitChunks: {
      chunks: "initial",
      cacheGroups: {
        vendors: {
          test: /[\\/]node_modules[\\/]/,
          name: "vendor"
        }
      }
    }
  },
  devtool: "source-map",
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "babel-loader"
          }
        ]
      },
      {
        test: /\.(ts|tsx)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "ts-loader"
          }
        ]
      },
      {
        test: /\.(js|jsx)$/,
        use: 'react-hot-loader/webpack',
        include: /node_modules/
      },
      {
        test: /\.css$/,
        use: [
          ExtractCssChunks.loader, "css-loader",
        ]
      },
....
resolve: {
    extensions: [".ts", ".tsx", ".js", ".css"]
  },
2。 webpack.dev-server.js：

devtool: "inline-source-map",
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "babel-loader"
          }
        ]
      },
      {
        test: /\.(ts|tsx)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "ts-loader"
          }
        ]
      },
      {
        test: /\.css$/,
        use: [
          ExtractCssChunks.loader, "css-loader"
        ]
      },
....
 resolve: {
    extensions: [".ts", ".tsx", ".js", ".css"]
  },
我该如何解决，这样我才能在没有FLUSH CHUNKS警告的情况下使用tsx？

我收到此警告：[冲洗错误]：无法在Webpack块中找到样式/ localhost-theme-css。请检查Babel插件的用法。以下代码引起警告（用于设置react -...

Answer 1

尝试在tsconfig.json中将模块设置为“ EsNext”，我遇到了类似的问题，更改为“ EsNext”为我解决了这个问题。