相关疑难解决方法(0)

我正在尝试将路径映射添加到 monorepo。我已经有了eslint-plugin-import规则，并且在所有映射的导入上收到错误“无法解析模块的路径”。

app/\n\xe2\x94\x9c\xe2\x94\x80 package/\n\xe2\x94\x82  \xe2\x94\x9c\xe2\x94\x80 src/\n\xe2\x94\x82  \xe2\x94\x9c\xe2\x94\x80 tsconfig.json\n.eslintrc\ntsconfig.json\n

.eslintrc 看起来像

app/\n\xe2\x94\x9c\xe2\x94\x80 package/\n\xe2\x94\x82  \xe2\x94\x9c\xe2\x94\x80 src/\n\xe2\x94\x82  \xe2\x94\x9c\xe2\x94\x80 tsconfig.json\n.eslintrc\ntsconfig.json\n

内部 tsconfig.json 如下所示：

{\n  "parser": "@typescript-eslint/parser",\n  "plugins": [\n    "@typescript-eslint",\n    "import",\n  ],\n  "extends": [\n    "eslint:recommended",\n    "plugin:import/recommended",\n    "plugin:import/typescript"\n  ],\n  "settings": {\n    "import/resolver": {\n      "typescript": {}\n    }\n  }\n}\n

路径映射得很好，但我有 lint 错误“无论我尝试使用映射的路径，都无法解析模块 \'context\' 的路径。

研究表明我需要使用eslint-import-resolver-typescript包，但它并没有使错误消失。

我创建了一个全新的React应用

create-react-app demo 

我需要为某些目录/组件创建别名：

import { Header } from '@uicomponents' 

@uicomponents 路径“ src/hello/this/is/the/path/to/ui/components”的快捷方式在哪里

所有在线教程都告诉我我可以使用使用别名导入resolve.alias，但是我想知道如何使用全新的react app来做到这一点？

没有.babelrc或webpack.config.js文件。

有什么帮助吗？

VSCode linting 似乎不尊重我在 tsconfig.json 文件中定义的路径。

从 tsconfig.json 中定义的“别名”导入任何内容时，出现以下错误。

tsconfig.json：

{
  "compilerOptions": {
    "outDir": "./dist/",
    "module": "esNext",
    "strictNullChecks": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "allowJs": true,
    "jsx": "preserve",
    "skipLibCheck": true,
    "noUnusedParameters": true,
    "noUnusedLocals": true,
    "noImplicitAny": true,
    "noImplicitThis": true,
    "declaration": true,
    "allowSyntheticDefaultImports": true,
    "emitDecoratorMetadata": true,
    "target": "es5",
    "lib": ["es5", "es6", "es7", "es2017", "dom"],
    "types": ["react", "jest", "node"],
    "baseUrl": ".",
    "paths": {
      "~*": ["./src/*"],
      "common/*": ["src/common/*"],
      "test/*": ["test/*"],
      "test-utils": ["test/test-utils.tsx"],
      "static/*": ["static/*"],
      "storybook/*": [".storybook/*"]
    },
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "resolveJsonModule": …

在浏览完这篇文章并尝试了这里的所有内容之后。似乎什么都不起作用。

我们尝试将节点部分添加到导入/解析器中，但这似乎不起作用。我们也在使用 monorepo，这会产生什么影响吗？尝试过的其他方法是将 a 添加project到打字稿解析器，但这也不起作用。

尝试将路径切换到 tsconfig.json 内的直接路径，但这也不起作用。

这是我的文件：

导入示例：import { colors } from "@styles"

tsconfig.json：

{
  "compilerOptions": {
    "target": "es5",
    "outDir": "lib",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "declaration": true,
    "declarationDir": "lib",
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react",
    "baseUrl": ".",
    "paths": {
      "@styles/*": ["src/styles/*"],
      "@styles": ["src/styles/index.ts"],
      "@utils/*": ["src/utils/*"]
    }
  },
  "include": [
    "src/*",
    "stories/*",
  ], …

我正在尝试使用 react-native 中的相对路径导入模块，我的项目结构是这样的：

-Project
--Components
--- adapter.js
--src
---screen
----Main.js
--App.js

我想在我的 Main.js 中使用 adapter.js ，所以在Main.js我使用：import adapter from '/../Components/adapter'

这将引发以下错误：

找不到模块：无法解析“E:\reactjs\learn\Project\src\screens”中的“/../Components/adapter”