Question

我下面有我的create-react-app项目的文件夹结构。我有一个项目，但有多个结果。在开发和构建 projectA 时，我想复制 projectA 文件夹下的所有文件，并在必要时粘贴它们。

我可以使用主题，但是要构建的项目很多，并且组件可以完全更改与项目相关的内容。在这种方法中， login.js 和其他一些组件将为每个项目具有单独的条件块。经过几个项目后，这些组件将非常混乱。而且我不希望构建文件中包含其他项目的徽标。

我选择动态覆盖必要的文件。我正在寻找最佳实践。请帮忙。

projectA
    public
        index.html
        favicon.ico
    src 
        images
            logo.png
        pages
            page.js (this extends base_page)

projectB
    public
        index.html
        favicon.ico
    src 
        images
            logo.png
        pages
            page.js (this extends base_page)

public
    index.html
    favicon.ico
src
    images
        logo.png
    pages
        app.js
        base_page.js
        page.js (this extends base_page)
    index.js

Answer 1

可能，但是我认为您首先必须重组文件夹：

project
 |--webpack.config.js
 `--src
     |--common
     |   `--pages
     |      |--base-page.js
     |      `--other-resources.js
     |--appA
     |   |--images
     |   |  `--logoA.png
     |   `--pages
     |      `--page.js
     |--appB
     |   |--images
     |   |  `--logoB.png
     |   `--pages
     |      `--page.js
     ...

然后在您的appA/pages/page.js中，您可以执行类似的操作

import Page from '../../common/pages/base-page'

在您的Webpack中，条目可以是

module.exports = {
  entry: [
    './src/appA/index.js',
    './src/appB/index.js',
    // other apps
  ]
}

但是，我不确定在不弹出create-react-app的情况下是否可行。

有没有一种方法可以通过替换某些资产和组件来从单个应用程序构建多个应用程序？

1 个答案: