打字稿babel-plugin-module-resolver

时间:2018-11-02 07:27:48

标签: typescript react-native babel

您好,打字稿相当于babel-plugin-module-resolver。 我正在尝试将“ react-native”解析为“ react-native-web”。下面的例子。

import { View } from "react-native" 
// should resolve to to once compiled or run using ts-node or ts-loader
import { view } from "react-native-web"

我已经尝试解决了一段时间,然后才提出问题,但没有成功。这是我尝试过的。

首次尝试:-不成功

// tsconfig.json
"baseUrl": "./" 
"paths": {
  "react-native": ["node_modules/react-native-web"]
},
"skipLibCheck": true

第二次尝试:使用Babel作为翻译器:成功,但并不理想或优雅。由于将.tsx,.ts扩展名传递给babel节点时出现问题,即使使用--extensions“ .ts,tsx”标志,使用vscode调试时也会出现问题。

// .babelrc
{
    "plugins": [
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-proposal-object-rest-spread"
    ],
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react",
        "@babel/preset-typescript"
    ]
}

有人有什么想法吗?任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

您可以尝试以下操作:https://www.npmjs.com/package/tsconfig-paths

Typescript默认情况下模仿模块的Node.js运行时解析策略。但是,它也允许使用路径映射,该映射允许指定任意模块路径(不以“ /”或“。”开头),并将其映射到文件系统中的物理路径。打字稿编译器可以从tsconfig解析这些路径,因此可以正常编译。但是,如果您随后尝试使用节点(或ts-node)执行编译的文件,则它将仅在node_modules文件夹中一直查找到文件系统的根目录,因此无法在tsconfig中找到由路径指定的模块。