Leveraging TypeScript for the easy movement of objects between files, as

Question

Leveraging TypeScript for the easy movement of objects between files, as

After using TS for more than a year, I still find myself facing confusion when it comes to importing and exporting. Why am I unable to spread an object I imported into the export object?

/// file1
export {
  PORT,
  SSL_CRT,
  SSL_KEY,
}

// file2
import * as env from 'file1'
// env.PORT is accessible at this point
export {
   ...env  // [ts] Identifier expected. [1003] 
}

I manage to resolve this issue with the following workaround, although I understand it's not exactly what I want.

// file2
import * as env from 'file1'
export default {
   ...env  // [ts] Identifier expected. [1003] 
}

typescript

Answer 1

Answer №1

It appears that you attempted to re-export a module. Here is the correct way to do so:

// file2.ts
export * from './file1'

When using import * as env, you are unable to spread the namespace module object because it is a unique object that JavaScript does not allow spreading.

Answer 2

It appears that you attempted to re-export a module. Here is the correct way to do so:

// file2.ts
export * from './file1'

When using import * as env, you are unable to spread the namespace module object because it is a unique object that JavaScript does not allow spreading.

Answer 3

Answer №2

This solution appears to meet your expectations:

// script1.ts
export {
    USERNAME,
    PASSWORD,
    API_KEY
};

// script2.ts
import * as config from "./script1";

console.log(config); // { USERNAME: 'john_doe', PASSWORD: 'secret', API_KEY: 'abc123' }

export { config };

// script3.ts
import { config } from "./script2";

console.log(config); // { USERNAME: 'john_doe', PASSWORD: 'secret', API_KEY: 'abc123' }

To address your query: There is no need for the spread operator since the object is being destructured implicitly. The reasoning behind this behavior might require a more knowledgeable individual.

Answer 4

This solution appears to meet your expectations:

// script1.ts
export {
    USERNAME,
    PASSWORD,
    API_KEY
};

// script2.ts
import * as config from "./script1";

console.log(config); // { USERNAME: 'john_doe', PASSWORD: 'secret', API_KEY: 'abc123' }

export { config };

// script3.ts
import { config } from "./script2";

console.log(config); // { USERNAME: 'john_doe', PASSWORD: 'secret', API_KEY: 'abc123' }

To address your query: There is no need for the spread operator since the object is being destructured implicitly. The reasoning behind this behavior might require a more knowledgeable individual.

Leveraging TypeScript for the easy movement of objects between files, as

Answer №1

Answer №2

Similar questions

Creating a custom type for the parameter of an arrow function in Typescript

InitAuth0 Auth0 encountering deepPartial error in Next.js with TypeScript setup

What could be the root cause behind the error encountered while trying to authenticate a JWT?

Steps to create an instance method that only accepts the name of another instance method

Encountering an error in Angular 8 with the plugin: Unhandled ReferenceError for SystemJS

Unleashing the potential of an endless animation by incorporating pauses between each iteration

Discovering how to specify the type of a dynamically created object using 'for await' in TypeScript

Errors are encountered when attempting to run the React project command

Is there a way to differentiate between Angular running on a production server as opposed to running on localhost?

Ways to extract data from radio buttons using Angular 11

Prevent the array from altering its values

Unlawful manipulation of filtering in typescript

Issue with TypeScript: Error appears when importing express after running "npm i @types/express -D"

NgClass: checking if the array includes the specific item

What is Prettier's reasoning for suggesting the use of `;` before a destructuring assignment declaration?

What could be preventing me from setting a boolean variable within an Observable?

Substitute terms in a sentence while excluding those that are within a markdown hyperlink

The JSX component cannot be utilized as `ToastContainer`

Exploring the capabilities of Angular2 and Jasmine through testing

Methods to close the currently active ngx-modal when a new modal is triggered within the same Angular 8 component