如何 webpack 一个 node 模块在 React 和 React Native 中使用答案

【问题标题】：How to webpack a node_module for use in both React and ReactNative如何 webpack 一个 node 模块在 React 和 React Native 中使用
【发布时间】：2020-03-06 23:24:16
【问题描述】：

我正在构建一个库，它将被 React Native 项目和 React 项目用作托管在我的 github 上的 node_module。

事实证明，这相当令人生畏——基于我的代码变得多么丑陋，我觉得我一定是做错了什么。

这是当前问题，最近一期：

Failed to compile.

./node_modules/plenti-api/src/services/AccountService.ts 11:10
Module parse failed: Unexpected token (11:10)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| export default class AccountService {
>   private client: IClient
|   constructor(client: IClient) {
|     this.client = client

当尝试通过npm start 构建 React 项目时会发生这种情况。该项目在 React Native 方面成功构建和运行。

我需要在我的.tsconfig/.webpack.config.js/somethingelse 中输入什么，才能让这些打字稿结构存在于我的库中并正确导入到我的 Web 项目中？

【问题讨论】：

您要求 Node 加载一个 TypeScript 文件 (AccountService.ts)，但 Node 不知道 TypeScript 是什么。它只知道 JavaScript 和 JSON，而纯 JS 没有private 关键字（实际上，它没有 any 机制允许您在当前版本的规范）。
显而易见的答案是“因为你的 start 脚本可能包含一个编译过程，它首先将 TS 转换为 JS”，但是如果没有你展示你的 npm 脚本，没有人可以说。
@Mike'Pomax'Kamermans 在这种情况下 - 目标是否成为让我正在编写的模块在安装为 node_module 之前编译为 javascript？
鉴于 Node 只知道如何本地运行 JS：绝对。尽可能多地在 TS 中工作，但作为发布目标，您的模块应该是 JS，以便它可以在任何安装了 Node 并且仅安装了 Node 的系统上运行。
如果将来有人遇到此问题，希望对本指南大喊大叫twilio.com/blog/2017/06/…

标签： reactjs typescript react-native webpack

【解决方案1】：

感谢 cmets 中的@Mike，发现这是因为 node 需要用 vanilla javascript 编写，因此需要构建 node_modules 以便可以通过纯 javascript 导入。

这篇文章https://www.twilio.com/blog/2017/06/writing-a-node-module-in-typescript.html 对完成这项任务非常有帮助。

【讨论】：