我有一个包含React Typescript应用程序(使用“创建React应用程序”创建)的项目。我希望在此同一项目中有一个可运行的可执行脚本。应用程序和脚本都将只能在本地计算机上运行。
脚本和React应用程序依赖于相同的Typescript模块,该模块是一个名为algorithm.ts
的ts文件。我希望能够在CLI中执行以下操作:
npm start
--〉运行React应用npm run myscript
--〉运行脚本
我尝试了很多方法,最近的尝试是让脚本成为一个nodejs脚本,并在每次运行带有node的脚本之前将算法从Typescript编译为JS。然而,这在运行脚本时以以下错误结束:
$ npm run myscript
> tsc src/algorithm.ts && node src/myscript.js
file:///<path>/src/algorithm.js:2
exports.__esModule = true;
^
ReferenceError: exports is not defined
at file:///<path>/src/algorithm.js:2:1
at ModuleJob.run (internal/modules/esm/module_job.js:146:23)
at async Loader.import (internal/modules/esm/loader.js:165:24)
at async Object.loadESM (internal/process/esm_loader.js:68:5)
这也迫使脚本是JS而不是Typescript,这是我不喜欢的,但我想我可以接受。
以下是相关文件:
algorithm.ts
:
import { blabla } from "blabla";
...
export const function1 = ...
export const function2 = ...
...
ReactComponent.tsx
:
import { function1, function2 } from "./algorithm";
...
myscript.js
:
import * as algorithm from "algorithm.js"
...
包.json:
...
"type": "module",
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"myscript": "tsc src/algorithm.ts && node src/myscript.js"
},
...
tsconfig.json
:
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": [
"src"
]
}
1条答案
按热度按时间kh212irz1#
我终于让它工作了。问题是
tsc src/algorithm.ts
命令使用CommonJS而不是ESModules编译文件。为了解决这个问题,我创建了第二个tsconfig.json
文件:并将
package.json
中的脚本命令更改为使用此tsconfig文件"myscript": "tsc -p scripts/tsconfig.json && node src/myscript.js"
我仍然不知道这一切是否是矫枉过正,有一个更简单的方法来实现我想要的,所以不会标记为接受的答案。但至少它的工作!