Home > Web Front-end > JS Tutorial > How Can I Import Multiple Modules from a Directory in ES6?

How Can I Import Multiple Modules from a Directory in ES6?

Patricia Arquette
Release: 2024-12-01 05:24:13
Original
523 people have browsed it

How Can I Import Multiple Modules from a Directory in ES6?

ES6 Module Import from Multiple Files

ES6 allows importing multiple exports from a file using the syntax import {ThingA, ThingB, ThingC} from 'lib/things';. However, the same exports can also be imported from separate files with the syntax import ThingA from 'lib/things/ThingA'; which can lead to a lack of organization.

To remedy this, a desire arises to import exports from all files in a directory using a wildcard, e.g., import {ThingA, ThingB, ThingC} from 'lib/things/*';.

Availability

Unfortunately, this functionality is not currently supported. The resolution of module names is handled by module loaders, and no known implementation supports wildcards.

Workaround

Until wildcard imports become available, a viable workaround is to create an intermediate module file in lib/things/index.js with the following content:

export * from 'ThingA';
export * from 'ThingB';
export * from 'ThingC';
Copy after login

This allows you to import the desired exports as:

import {ThingA, ThingB, ThingC} from 'lib/things';
Copy after login

The above is the detailed content of How Can I Import Multiple Modules from a Directory in ES6?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template