如何使用jsconfig文件复制NODE_PATH env var的效果

时间:2019-08-06 16:12:27

标签: reactjs environment-variables create-react-app theming

我正在为一个拥有多个品牌的公司开发一个项目,每个品牌都有自己的网站,我的目标是能够拥有一个React应用程序,该应用程序在部署时将根据该品牌的服务器。

我当前的项目结构是:

my-CRA-project/
|
├── public/
│   ├── brand1/  /* static stuff for each theme */
│   │   ├── logo.png
│   │   ├── staticData.json
│   │   └── etc...
│   ├── brand2/ 
|   └── etc... 
|
├── src/ 
│   ├── themes/ /* sass vars for each theme */
│   │   ├── brand1/
│   |   │   └── _vars.scss
│   │   ├── brand2/  
│   |   │   └── _vars.scss
|   │   └── etc...
|   |
│   └── ...rest of src code
└── ...rest of project

我正在设置

NODE_PATH=./node_modules;./public/brandN
SASS_PATH=./node_modules;./src/themes/brandN

让每个品牌在部署时合并其特定文件。

问题在于React的最新版本不赞成使用NODE_PATH变量,现在它说改为使用jsconfig.json文件,这违背了我使用NODE_PATH变量的目的。

是否可以使用jsconfig.json文件复制此行为?甚至除此之外,我是否可以通过更好的方法来构造整个项目以实现相同的目标?

2 个答案:

答案 0 :(得分:0)

下面是一个JavaScript项目的示例jsconfig.json文件。您可以创建尚不存在的文件:

{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": ["src"]
}

答案 1 :(得分:0)

你可以使用 webpack 和它的别名 例如在下一个 js 中,它将进入组件文件夹,然后根据 env 进入子文件夹

const path = require('path')

module.exports = {
  webpack: (config, options) => {
    config.module.rules.push({
      resolve: {
        alias: {
          test: path.resolve(__dirname,`components/${process.env.test}`),
        }
      }
    })
    return config
  }
}