feat: alias prefixed by at sign

Created by: fredericrous

alias prefixed with @/ instead of importing services/someService, with this PR we would import from @/services/someService

illustrate idea at https://github.com/facebook/create-react-app/discussions/12666

packages/react-scripts/config/webpack.config.js

@@ -328,7 +328,7 @@ module.exports = function (webpackEnv) {
           'react-dom$': 'react-dom/profiling',
           'scheduler/tracing': 'scheduler/tracing-profiling',
         }),
-        ...(modules.webpackAliases || {}),
+        ...(modules.webpackAliases?.map((alias) => `@/${alias}`) || {}),
       },
       plugins: [
         // Prevents users from importing files from outside of src/ (or node_modules/).

packages/react-scripts/scripts/utils/createJestConfig.js

@@ -56,7 +56,7 @@ module.exports = (resolve, rootDir, isEjecting) => {
     moduleNameMapper: {
       '^react-native$': 'react-native-web',
       '^.+\\.module\\.(css|sass|scss)$': 'identity-obj-proxy',
-      ...(modules.jestAliases || {}),
+      ...(modules.jestAliases?.map((alias) => `@/${alias}`) || {}),
     },
     moduleFileExtensions: [...paths.moduleFileExtensions, 'node'].filter(
       ext => !ext.includes('mjs')