Is it possible to import modules from all files in a directory, using a wildcard?

前端 未结 13 2036
陌清茗
陌清茗 2020-11-22 04:25

With ES6, I can import several exports from a file like this:

import {ThingA, ThingB, ThingC} from \'lib/things\';

However, I like the orga

相关标签:
13条回答
  • 2020-11-22 04:43

    Just an other approach to @Bergi's answer

    // lib/things/index.js
    import ThingA from './ThingA';
    import ThingB from './ThingB';
    import ThingC from './ThingC';
    
    export default {
     ThingA,
     ThingB,
     ThingC
    }
    

    Uses

    import {ThingA, ThingB, ThingC} from './lib/things';
    
    0 讨论(0)
  • 2020-11-22 04:43

    if you don't export default in A, B, C but just export {} then it's possible to do so

    // things/A.js
    export function A() {}
    
    // things/B.js
    export function B() {}
    
    // things/C.js
    export function C() {}
    
    // foo.js
    import * as Foo from ./thing
    Foo.A()
    Foo.B()
    Foo.C()
    
    0 讨论(0)
  • 2020-11-22 04:44

    Just a variation on the theme already provided in the answer, but how about this:

    In a Thing,

    export default function ThingA () {}
    

    In things/index.js,

    export {default as ThingA} from './ThingA'
    export {default as ThingB} from './ThingB'
    export {default as ThingC} from './ThingC'
    

    Then to consume all the things elsewhere,

    import * as things from './things'
    things.ThingA()
    

    Or to consume just some of things,

    import {ThingA,ThingB} from './things'
    
    0 讨论(0)
  • 2020-11-22 04:48

    I've used them a few times (in particular for building massive objects splitting the data over many files (e.g. AST nodes)), in order to build them I made a tiny script (which I've just added to npm so everyone else can use it).

    Usage (currently you'll need to use babel to use the export file):

    $ npm install -g folder-module
    $ folder-module my-cool-module/
    

    Generates a file containing:

    export {default as foo} from "./module/foo.js"
    export {default as default} from "./module/default.js"
    export {default as bar} from "./module/bar.js"
    ...etc
    

    Then you can just consume the file:

    import * as myCoolModule from "my-cool-module.js"
    myCoolModule.foo()
    
    0 讨论(0)
  • 2020-11-22 04:54

    I don't think this is possible, but afaik the resolution of module names is up to module loaders so there might a loader implementation that does support this.

    Until then, you could use an intermediate "module file" at lib/things/index.js that just contains

    export * from 'ThingA';
    export * from 'ThingB';
    export * from 'ThingC';
    

    and it would allow you to do

    import {ThingA, ThingB, ThingC} from 'lib/things';
    
    0 讨论(0)
  • 2020-11-22 04:56

    Similar to the accepted question but it allows you to scale without the need of adding a new module to the index file each time you create one:

    ./modules/moduleA.js

    export const example = 'example';
    export const anotherExample = 'anotherExample';
    

    ./modules/index.js

    // require all modules on the path and with the pattern defined
    const req = require.context('./', true, /.js$/);
    
    const modules = req.keys().map(req);
    
    // export all modules
    module.exports = modules;
    

    ./example.js

    import { example, anotherExample } from './modules'
    
    0 讨论(0)
提交回复
热议问题