The following changes are being made to your tsconfig.json file

[rexleimo]

The following changes are being made to your tsconfig.json file:

• compilerOptions.baseUrl must not be set (absolute imports are not supported (yet))
• compilerOptions.paths must not be set (aliased imports are not supported)

[dawnmist]

I assume (since you didn't actually write a question) that you're trying to use absolute paths.

Try the suggestions here: facebook/create-react-app#5645 (comment) - if having those two settings in a differently named tsconfig file that gets imported stops react-scripts from removing them, you're all good (and can ignore that react-scripts still complains at you).

Current state of potential implementation (currently for baseUrl only, aliases to follow later once they've worked out what they will support) for CRA: facebook/create-react-app#6656

Being able to set those is currently targetted for CRA 3 - https://github.com/facebook/create-react-app/projects/6 . The spot where react-scripts overwrites the values in your tsconfig.json file is not one that react-app-rewired can currently modify (it happens outside of the webpack configurations).

One other possibility is to use a library called patch-package to modify the react-scripts/scripts/utils/verifyTypescriptSetup.js file. I've found that if you change the value: undefined in the baseUrl to suggested: '.' and paths to suggested: { 'src/*': ['src/*'] } it stopped react-scripts from removing them from my tsconfig.json file (adjust to match what you want of course). Below is a copy of the diff that I've used with patch-package to patch react-scripts so that it leaves my tsconfig.json baseUrl and paths alone:

diff --git a/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js b/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
index fa4b5c8..13c81b5 100644
--- a/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
+++ b/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
@@ -124,10 +124,10 @@ function verifyTypeScriptSetup() {
     // We do not support absolute imports, though this may come as a future
     // enhancement
     baseUrl: {
-      value: undefined,
+      suggested: '.',
       reason: 'absolute imports are not supported (yet)',
     },
-    paths: { value: undefined, reason: 'aliased imports are not supported' },
+    paths: { suggested: { 'src/*': ['src/*'] }, reason: 'aliased imports are not supported' },
   };
 
   const formatDiagnosticHost = {

Note that none of these suggestions can be done via react-app-rewired - this is one area where other tools are more appropriate.

[XianZhengquan]

I assume (since you didn't actually write a question) that you're trying to use absolute paths.

Try the suggestions here: facebook/create-react-app#5645 (comment) - if having those two settings in a differently named tsconfig file that gets imported stops react-scripts from removing them, you're all good (and can ignore that react-scripts still complains at you).

Current state of potential implementation (currently for baseUrl only, aliases to follow later once they've worked out what they will support) for CRA: facebook/create-react-app#6656

Being able to set those is currently targetted for CRA 3 - https://github.com/facebook/create-react-app/projects/6 . The spot where react-scripts overwrites the values in your tsconfig.json file is not one that react-app-rewired can currently modify (it happens outside of the webpack configurations).

One other possibility is to use a library called patch-package to modify the react-scripts/scripts/utils/verifyTypescriptSetup.js file. I've found that if you change the value: undefined in the baseUrl to suggested: '.' and paths to suggested: { 'src/*': ['src/*'] } it stopped react-scripts from removing them from my tsconfig.json file (adjust to match what you want of course). Below is a copy of the diff that I've used with patch-package to patch react-scripts so that it leaves my tsconfig.json baseUrl and paths alone:

diff --git a/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js b/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
index fa4b5c8..13c81b5 100644
--- a/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
+++ b/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js
@@ -124,10 +124,10 @@ function verifyTypeScriptSetup() {
     // We do not support absolute imports, though this may come as a future
     // enhancement
     baseUrl: {
-      value: undefined,
+      suggested: '.',
       reason: 'absolute imports are not supported (yet)',
     },
-    paths: { value: undefined, reason: 'aliased imports are not supported' },
+    paths: { suggested: { 'src/*': ['src/*'] }, reason: 'aliased imports are not supported' },
   };
 
   const formatDiagnosticHost = {

Note that none of these suggestions can be done via react-app-rewired - this is one area where other tools are more appropriate.

After changing, can't I start with react-app-rewired + customize-cra?

[dawnmist]

What I meant was that stopping create-react-app from overwriting your tsconfig.json file could not be done through react-app-rewired + customize-cra. Stopping that can only be done either by the suggestions on the create-react-app issue I linked, or by modifying react-scripts (either by forking it, or by creating a small patch to be automatically applied by something like patch-package).

React-app-rewired can be used to start/build the project afterwards, it just is not able to stop that file from being modified by react-scripts.

[XianZhengquan]

I have modified the react-scripts now and used the patch-package record, but I can't start the project.I don't know where the problem is.

[XianZhengquan]

我的意思是，不能通过react-app-rewired + customize-cra 来_阻止_ create-react-app覆盖你的tsconfig.json文件。停止这种情况只能通过我链接的create-react-app问题上的建议来完成，或者通过修改react-scripts（通过分叉它，或者通过创建一个小补丁来自动应用类似的东西patch-package）来完成。

React-app-rewired可用于之后启动/构建项目，它无法阻止该文件被react-scripts修改。

[dawnmist]

@XianZhengquan You have a typo at the end of the "paths" line in your react-scripts patch - two closing brackets when there should be one. And you're missing the closing bracket in the suggested object of the same line (i.e. one of those extra brackets at the end should be before the comma for the reason message).

// You have:
paths: { suggested: { '@/*': ['src/*'], reason: 'aliased imports are not supported' }},
// It should be:
paths: { suggested: { '@/*': ['src/*'] }, reason: 'aliased imports are not supported' },

[XianZhengquan]

@dawnmist sorry,I modified it, but still can't start the project.can you give me your email, easy to contact?This is my mail box evilweirdo@163.com

[XianZhengquan]

[ChenYCL]

add paths.json on dir root

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "src/*": ["src/*"],
      "components/*": ["src/components/*"]
    }
  }
}

tsconfig.json

 "extends": "./paths.json",

config-override.js

webpack:override(
// ...
addWebpackAlias({
    ['components']: path.resolve(__dirname, './src/components'),
  })
)

can solve it.

[fhillipgcastillo]

This is closed, but for anyone looking for this issue in the future, I found that for local dev, the solution is to add our aliases to the webpage config-overrides.js file, so it solves the aliases issue.

An example:

// config-overrides.js
// import this at the top
const path = require('path');

module.exports = function override(config) {
  config.resolve = {
    ...config.resolve,
    alias: {
      ...config.alias,
      'services': path.resolve(__dirname, 'src/shared/services'),
      'interfaces': path.resolve(__dirname, 'src/shared/interfaces')
    },
  };
return config;
};

All this information I found was by @gustavograeff1998 at medium, in this Source.