2

我有一个create-react-app没有弹出和重新接线react-app-rewired和定制的customize-cra. 这是场景,我目前无法更改。

这是配置config-overrides.js

const path = require('path')
const fs = require('fs')
const {
  override,
  overrideDevServer,
  watchAll,
  removeModuleScopePlugin,
  addWebpackModuleRule
} = require('customize-cra')

const theme = process.env.REACT_APP_THEME
const currentDirectory = fs.realpathSync(process.cwd())
const resolveApp = relativePath => path.resolve(currentDirectory, relativePath)

module.exports = {
  webpack: override(
    removeModuleScopePlugin(),
    addWebpackModuleRule({
      test: /\.svg$/,
      loader: 'raw-loader',
      include: [
        resolveApp('../source/' + theme + '/icons/dist')
      ]
    })
  ),
  devServer: overrideDevServer(
    watchAll()
  ),
  paths: paths => {
    paths.appBuild = path.join(paths.appBuild, theme)
    return paths
  }
}

css现在的一个新需求是从本地包中导入一些应用程序,package.json并使用本地命名空间进行设置

  "dependencies": {
    "@namespace/helpers": "*",

我认为使用react-app-rewire-multiple-entry这似乎是为重新连接的 create-react-app 导入多个条目的完美库

这是新的更新:

const path = require('path')
const fs = require('fs')
const {
  override,
  overrideDevServer,
  watchAll,
  removeModuleScopePlugin,
  addWebpackModuleRule
} = require('customize-cra')

const theme = process.env.REACT_APP_THEME
const currentDirectory = fs.realpathSync(process.cwd())
const resolveApp = relativePath => path.resolve(currentDirectory, relativePath)

// new css entries configuration
const cssEntries = require('react-app-rewire-multiple-entry')([
  {
    entry: './src/index.tsx',
    helpers_1: '../node_modules/@namespace/helpers/dist/index.css',
    helpers_2: '@namespace/helpers/dist/index.css'
  }
])

module.exports = {
  webpack: override(
    cssEntries.addMultiEntry, // new css entries
    removeModuleScopePlugin(),
    addWebpackModuleRule({
      test: /\.svg$/,
      loader: 'raw-loader',
      include: [
        resolveApp('../source/' + theme + '/icons/dist')
      ]
    })
  ),
  devServer: overrideDevServer(
    watchAll()
  ),
  paths: paths => {
    paths.appBuild = path.join(paths.appBuild, theme)
    return paths
  }
}

但是当前实现的两种方法(首先helpers_1: '../node_modules/@namespace/helpers/dist/index.css',和然后helpers_2: '@namespace/helpers/dist/index.css')都没有将 css 加载到create-react-app.

有什么想法可以解决吗?或者你看到了什么错误?

提前致谢

4

0 回答 0