Question

使用打字稿获取解析错误

src / constants / Config.ts

export const Config = {
  auth0: {
    client_id: 'xxxx',
    connection: 'xxxx',
    url: 'https://xxxx.eu.auth0.com',
  },
};

import {Config} from '@src/constants/Config';

在expact-native上使用expo，无法构建脚本

Unable to resolve "@src/constants/Config" from "src/containers/layouts/auth/signUp2/signUp2.component.tsx"
Failed building JavaScript bundle.

使用tsc尝试构建，构建很好，但是运行expo start会发现该错误

tsconfig

{
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/tsc-out",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "moduleResolution": "node",
    "skipLibCheck": true,
    "sourceMap": true,
    "resolveJsonModule": true,
    "experimentalDecorators": true,
    "jsx": "react-native",
    "module": "es2015",
    "target": "es2017",
    "lib": [
      "es2015",
      "es2016"
    ],
    "paths": {
      "@src/*": ["./src/*"],
      "@kitten/*": ["./node_modules/react-native-ui-kitten/*"]
    },
    "typeRoots": [
      "./node_modules/@types"
    ]
  },
  "include": [
    "./src/**/*"
  ],
  "exclude": [
    "./node_modules"
  ]
}

babel

const path = require('path');
const Config = require('./config');

// FIXME: Resolve `transform[stderr]: Could not resolve` command-line warnings.
// FIXME: Reproducible when starting with clearing cache (npm start -- -c)
//
// TODO: Framework path aliasing even not needed here. Replace?
// TODO: Replace nested package.json-s with aliases

const moduleResolverConfig = {
  root: path.resolve('./'),
  alias: {
    '@kitten/theme': path.resolve(Config.KITTEN_PATH, 'theme'),
    '@kitten/ui': path.resolve(Config.KITTEN_PATH, 'ui'),
    '@eva-design/eva': path.resolve(Config.MAPPING_PATH),
    '@eva-design/processor': path.resolve(Config.PROCESSOR_PATH),
  },
};

module.exports = function (api) {
  api.cache(true);

  const presets = [
    'babel-preset-expo',
  ];

  const plugins = [
    ['module-resolver', moduleResolverConfig],
  ];

  return { presets, plugins };
};

Answer 1

我在这里看到“小猫技巧”应用程序配置文件。拥有别名的目的只是为该应用程序提供一个开发环境，因为我们有时会使用它来查看react-native-ui-kitten的更改。如果仅在生产模式下使用它，则可以删除dev.env.js文件夹中的./config。

Answer 2

最终工作的是同时设置babel config和tsconfig

由于导入解析错误，世博会构建失败

2 个答案: