首页 > 编程语言 >解决 typescript node tsx 的兼容问题

解决 typescript node tsx 的兼容问题

时间:2023-12-30 21:45:37浏览次数:34  
标签:node typescript type TypeScript export tsx import true

问题

在项目中使用 typescript + tsx + node 存在各种兼容问题,包括:

  • [esbuild Error]: Top-level await is currently not supported with the "cjs" output format

  • Cannot find module 'X'. Did you mean to set the 'moduleResolution' option to 'nodenext', or to add aliases to the 'paths' option?

  • X is a type and must be imported using a type-only import when 'verbatimModuleSyntax' is enabled

  • An 'export default' must reference a value when 'verbatimModuleSyntax' is enabled, but 'X' only refers to a type

配置

配置下述文件后,以上问题得以解决。

package.json

package.json 中添加:"type": "module"
"script" 中使用 tsx,例如:"dev": "npx tsx src/app.ts"

tsconfig.json

tsconfig.json 中设置如下内容:

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "allowImportingTsExtensions": true,
    "customConditions": ["module"],
    "allowArbitraryExtensions": true,
    "noEmit": true,
    "verbatimModuleSyntax": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true
  },
}

import、export

使用 export type X = {} 导出 TypeScript Type,例如:

export type X = {
    item_1: string,
    item_2: string
}

同样,使用 import type { X } from path 导入 TypeScript Type,例如:

import type { X }  from './types'

导入和导出第三方库使用 ESM 形式,例如:

import express from 'express'
export default X

参考

标签:node,typescript,type,TypeScript,export,tsx,import,true
From: https://www.cnblogs.com/risejl/p/17936859

相关文章

  • nodejs多线程-共享内容
    前言:昨天遇到基于Nodejs启动多线程,以便不同服务之间可以调用(共享内存) worker_threadsnode官方文档注明了:worker_threads模块允许使用并行地执行JavaScript的线程。与child_process或cluster不同,worker_threads可以共享内存。它们通过传输ArrayBuffer实例或共享Sh......
  • Vite + ESBuild error: No loader is configured for ".node" files: node_modules/fs
    Vite+ESBuilderror:Noloaderisconfiguredfor".node"files:node_modules/fsevents/fsevents.nodeAddfseventstoyouroptimizeDepsexcludeinyourvite.config.jsfile:optimizeDeps:{exclude:["fsevents"]},import{defineConfig......
  • antlr 在一段字符可被多个 terminal node 匹配时的行为
    考虑下面一段antlr语法STRING:[a-zA-Z0-9]+;NUMBER:[0-9]+;NEWLINE:'\r'?'\n';root:idtitleEOF;id:'id:'NUMBERNEWLINE;title:'title:'STRINGNEWLINE;我们希望id:后面只存在数字,而title:后买可存在数字或字母,因而定义了NUMBER和STRIN......
  • Windows环境检验NodeJs安装是否成功
    Windows环境检验NodeJs安装是否成功检验方法1、win+R打开运行窗口,在此窗口输入cmd命令编辑2、进入命令提示符窗口,分别输入以下命令,显示版本号,则安装成功node-v:显示安装的nodejs版本npm-v:显示安装的npm版本编辑如上图说明安装成功我本机的环境版本低一点因为是安装鸿蒙IDE自动安......
  • nodejs学习05——mongoose
    简介Mongoose是一个对象文档模型库,官网http://www.mongoosejs.net/作用:方便使用代码操作mongodb数据库初体验//1.安装mongoose//2.导入mongooseconstmongoose=require('mongoose');//设置strictQuery为truemongoose.set('strictQuery',true);//3.连接......
  • [Node]Node.js安装
    工作需求,将本地node.js升级到v20+,踩坑踩了1个多小时,故整理一篇攻略自用。 下载与安装1.Node.js官网下载安装包:https://nodejs.org/en(我下载的是20.10.0)2.安装时修改安装目录,网上教程大多不建议放在C盘;其余默认。3.安装完后启动命令行工具,输入node-v可查看安装好的版本......
  • 在nodejs环境里使用canvas和sharp生成图片
    1.安装依赖包npminstalljsdomcanvas2.实例代码const{JSDOM}=require('jsdom');const{createCanvas}=require('canvas');//创建一个虚拟DOM环境constdom=newJSDOM('<!DOCTYPEhtml><html><head></head><body>&......
  • vue前端node内存溢出问题解决
    前端项目运行时,如果经常运行慢,崩溃停止服务,报如下错误:FATALERROR:CALL_AND_RETRY_LASTAllocationfailed-JavaScriptheapoutofmemory(JavaScript堆内存不足) 原因:因为在Node中,通过JavaScript使用内存时只能使用部分内存(64位系统:1.4GB,32位系统:0.7GB),这个时候,如......
  • sse node搭建server
    sse-client.tsexportdefaultclassSSEClient{source:EventSource;element:HTMLElement;constructor(url){this.source=newEventSource(url||'http://127.0.0.1:8844/stream');this.source.onopen=this.onOpen.bin......
  • typeScript中map和filter的用法
    首先,这两个方法map()和filter()都是对调用他们的数组进行遍历。那么在项目中,什么情况下使用map(),又在什么情况下使用filter()呢?1、map()的使用方法:arr.map((item,index,array)=>{……})2、filter()的使用方法:arr.filter((item,index,array)=>{……})都是将函数写在方法的......