Challenges associated with the '--isolatedModules' flag and RouterContext

After attempting to run my deno application, I encountered the following error message and I'm unsure about the cause. Has anyone else faced this issue before?

Command used to run: deno run --allow-all server.ts

Error:

Error: TS1205 [ERROR]: Re-exporting a type while the '--isolatedModules' flag is enabled requires the use of 'export type'.
  RouterContext,
  ~~~~~~~~~~~~~
    at file:///Users/XXXX/Documents/DenoAPP/deps.ts:4:3

deps.ts

export { Application, Router, RouterContext, Context, send } from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="650a040e251354554b514b55">[email protected]</a>/mod.ts";
export { MongoClient } from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="c6aba9a8a1a986b0f6e8f4ffe8f4">[email protected]</a>/mod.ts";
export { hashSync, compareSync} from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="593b3a2b20292d192f69776a">[email protected]</a>/mod.ts";
import "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="acc8c3d8c9c2daecda9f829e829c">[email protected]</a>/load.ts";
export * from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="65010f12112513574b51">[email protected]</a>/mod.ts";
typescriptdenooak

Answer №1

To overcome your issue, consider utilizing the type modifier on the type names. This method is the conventional and recommended way for TypeScript version ≥ 4.5:

export {
  Application,
  Router,
  type RouterContext,
  Context,
  send,
} from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d1beb0ba91a7e0e1ffe5ffe1">[email protected]</a>/mod.ts";

Answer №2

For a detailed explanation, you can refer to --isolatedModules.

When examining OAK RouterContext, you will notice that they indeed export type themselves.

Therefore, it is recommended to follow the same pattern and separate the code as follows:

export { Application, Router, RouterContext, Context, send } from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5f303e341f296e6f716b716f">[email protected]</a>/mod.ts";

Divide it into:

export { Application, Router, send } from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="8ce3ede7ccfabdbca2b8a2bc">[email protected]</a>/mod.ts";
export type { RouterContext, Context } from "https://deno.land/x/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="28474943685e1918061c0618">[email protected]</a>/mod.ts";

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Guide on creating a custom command within the declaration of Tiptap while extending an existing extension with TypeScript

I'm currently working on extending a table extension from tiptap and incorporating an additional command. declare module '@tiptap/core' { interface Commands<ReturnType> { table: { setTableClassName: () => ReturnType; ...

typescripttiptap

Utilize Firebase for Playwright to efficiently implement 'State Reuse' and 'Authentication Reuse'

In my testing environment, I want to eliminate the need for repeated login actions in each test run. My approach involves implementing 'Re-use state' and 'Re-use Authentication', but I've encountered a challenge with Firebase using ...

typescriptfirebasetestingautomationplaywright

Surprising fraction of behavior

Looking for some clarification on the types used in this code snippet: interface UserDTO { id: string; email: string; } const input: Partial<UserDTO> = {}; const userDTO: Partial<UserDTO> = { id: "", ...input }; const email = us ...

typescript

What are the methods to determine the cause of ESLint's slow performance?

Looking to analyze the performance of ESLint in my application. So far, I have only come across one profiling tool provided by ESLint which is the TIMING=1 environment variable. Combining this with DEBUG=eslint:cli-engine allows me to see timing results pe ...

node.jstypescripteslint

The Battle of Extends and Intersection in Typescript

Typescript's concept of extension is akin to C++'s inheritance. Intersection in Typescript involves creating a new object with all the properties from the intersected classes. Why utilize intersection when extends keyword can already merge ...

javascripttypescript

Transferring information from RSC to a nested child component using the Next.js application router

Currently, I am in the process of migrating a large Pages router next.js project to the App directory. However, I have encountered a common challenge for which I am struggling to find a suitable solution. Despite being accustomed to the convenience of Reac ...

reactjstypescriptnext.jsreact-server-components

Which symbol or character corresponds to the public "get symbol" method?

While going through some Typescript code, I came across a line that is giving me trouble to understand. const symbol = Symbol.for('symbolname'); class Something { public get [symbol]() { return true; } ... } I am confused abou ...

javascripttypescript

The video in the TypeScript code within the Owl Carousel is not displaying properly - only the sound is playing. The video screen remains stationary

I recently updated my query. I am facing an issue while trying to play a video in Owl Carousal with a button click. The video plays sporadically, and most of the time it doesn't work properly. When playing without the carousel, a single video works fi ...

javascriptangulartypescriptowl-carousel

What could be the reason behind the absence of this.props.onLayout in my React Native component?

In my React Native app, I have the below class implemented with Typescript: class Component1 extends React.Component<IntroProps, {}> { constructor(props){ super(props) console.log(props.onLayout) } ... } The documentation for the View ...

javascriptreactjstypescriptreact-native

Elevated UI Kit including a setFloating function paired with a specialized component that can accept

I am currently experimenting with using Floating UI alongside various custom React components. These custom components create internal element references for tasks like focus and measurements, but they also have the capability to accept and utilize a RefOb ...

reactjstypescriptfloating-ui

What is the best way to transfer an array of objects between two components in React?

I've exhausted all the solutions found online, but I'm still facing a persistent issue. Despite my efforts, whenever I try to log information in another component, it keeps showing as undefined. (Just to clarify, the data being dealt with is an ...

angulartypescript

Issue with updating boolean values in reactive form controls causing functionality to not work as expected

I am currently facing an issue with validating a group of checkboxes. The main problem is that even though the 'this.dataService.minRequired' variable updates in the service, the validation state does not reflect these changes. I initially though ...

angulartypescript

Verification based on conditions for Angular reactive forms

I am currently learning Angular and working on creating a reactive form. Within my HTML table, I have generated controls by looping through the data. I am looking to add validation based on the following cases: Upon page load, the Save button should be ...

angulartypescriptangular-reactive-forms

What is the best way to exhibit information from a get request within an option tag?

My GET request is fetching data from a REST API, and this is the response I receive: { "listCustomFields": [ { "configurationType": null, "errorDetails": null, "fieldId" ...

arraysjsonangulartypescript

Angular FormControl is a built-in class that belongs to the Angular forms module. It

I’ve been working on adjusting tslint for the proper return type, and here’s what I have so far: get formControls(): any { return this.form.controls; } However, I encountered an error stating Type declaration of 'any' loses type-safet ...

angulartypescript

Generate a div element dynamically upon the click of a button that is also generated dynamically

Putting in the effort to improve my Angular skills. I've found Stack Overflow to be extremely helpful in putting together my first app. The service used by my app is located in collectable.service.ts: export class CollectableService { private col ...

angulartypescript

Issue with Jest mock function failing to trigger axios instance function causing it to return undefined

I initially found a solution on this StackOverflow thread However, I wanted to add my own helper function that generates a fresh Axios instance with the user's authentication token. Here is what I came up with: import axios from "axios"; c ...

javascripttypescriptunit-testingaxiosjestjs

Creating a form with multiple components in Angular 6: A step-by-step guide

I'm currently working on building a Reactive Form that spans across multiple components. Here's an example of what I have: <form [formGroup]="myForm" (ngSubmit)="onSubmitted()"> <app-names></app-names> <app-address> ...

angulartypescriptangular6angular-reactive-formsangular-forms

Enhance the capabilities of a basic object by incorporating a superclass through the creation of

I'm currently developing a library using Typescript 2.0 that can be utilized from both Typescript and JavaScript. Within the library, there is a class called Component and a function named registerComponent, both written in Typescript. My goal is to ...

typescript

React/Typescript: The object might be null

I am currently converting a React component to TypeScript. The component is making an API call, and although I believe my interfaces are correctly set up, I seem to be passing the types incorrectly. How can I resolve the two errors in the Parent componen ...

reactjstypescriptfetchreact-typescript