当前位置:  开发笔记 > 编程语言 > 正文

es6 - 导入所有没有别名的命名模块

如何解决《es6-导入所有没有别名的命名模块》经验,为你挑选了3个好方法。

我知道我们可以使用别名导入所有命名的模块,如下所示,

import * as name from "module-name";

参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

实际上,我已经在A.js中重新导出了我的模块,同样在B.js中继承了.PFB.现在,它是两级继承,因此导入命名模块并不是什么大问题.但是,当我把它带到5级继承(A - > B - > C - > D - > E)时,我需要在所有文件中导入所有命名的模块,并且需要进行(重新)导出在所有.而不是这样做,

有没有其他方法可以将所有命名模块的范围复制到所有级别而不重复轮子(导入和导出)

在这个设计的背后是使他们遵循Opps概念并避免重新声明相同的模块.

A.js

import React from 'react';
import I18n from 'i18n-js';
import m1 from 'module1';
import m2 from 'module2';

export default class A extends React.Component {}

export {React, I18n, m1, m2)

B.js

import BaseComponent from './A';
import {React, I18n, m1, m2) from './A;

export default class B extends A {}

有没有办法导入所有没有别名的命名模块import {*} from './A'(而不是B.js中的第二个)



1> zerkms..:

有没有办法导入所有命名的模块没有别名像'./A'中的import {*}(而不是B.js中的第二个)

没有.

并且重新导出的整个想法比您需要的更多,以保存最终js文件中的"行数",如您所述

Bcz,它在最终的js文件中为每个导入放置两行.考虑如果有10个导入行,则在最终的js中添加20行.当你考虑生产时,它会花费太多

没有多大意义,因为这是JS minifiers的用途.

总结一下:首先不应该这样做:

    export只需要导出的内容

    import无论你需要什么你需要的地方.

    您使用JS minifiers来优化输出JS文件大小.



2> einarmagnus..:

这是我做过的一个疯狂的实验,虽然有效,但在我不完全理解的方面可能很危险.有人会向我解释为什么我们不这样做?

var lodash = require("lodash");

function $localizeAll(name) {
    return `eval("var " + Object.getOwnPropertyNames(${name}).reduce((code, prop)=>{
        if (/^[a-zA-Z$_][a-zA-Z$_0-9]*$/.test(prop)) {
            return code.concat(\`\${prop} = ${name}["\${prop}"]\n\`);
        } else {
            console.warn("did not import '" + prop + "'");
            return code;
        }
    }, []).join(", ")+";")`
}

// this will make all exports from lodash available
eval($localizeAll("lodash"));

console.log(add(indexOf([1,2,6,7,12], 6), 5)); // => 7

它有点复杂,因为它在两个级别中进行了规避,但它基本上迭代了具有给定名称的对象的所有属性,并将具有符合条件的名称的所有属性绑定到该名称的标识符:

var length = lodash["length"]
  , name = lodash["name"]
  , arguments = lodash["arguments"]
  , caller = lodash["caller"]
  , prototype = lodash["prototype"]
  , templateSettings = lodash["templateSettings"]
  , after = lodash["after"]
  , ary = lodash["ary"]
  , assign = lodash["assign"]
  , assignIn = lodash["assignIn"]
  , assignInWith = lodash["assignInWith"]
  , assignWith = lodash["assignWith"]
  , at = lodash["at"]
  , before = lodash["before"]
  , bind = lodash["bind"]
  , bindAll = lodash["bindAll"]
  , bindKey = lodash["bindKey"]
  //...
  , upperCase = lodash["upperCase"]
  , upperFirst = lodash["upperFirst"]
  , each = lodash["each"]
  , eachRight = lodash["eachRight"]
  , first = lodash["first"]
  , VERSION = lodash["VERSION"]
  , _ = lodash["_"]
  ;

这个列表中有一些例子说明为什么这是一个坏主意(例如阴影arguments).

您应该能够如下使用它(尽管您可能不应该像上面所说的那样).

B.js

import BaseComponent, * as extras from './A';

eval($localizeAll("extras"));

export default class B extends BaseComponent {}

无论如何,无法抗拒尝试这一点;)



3> Csaba Fityó..:

JavaScript解决方案:

import * as exports from 'foo';
Object.entries(exports).forEach(([name, exported]) => window[name] = exported);

注意:导入的包装对象保留在那里。


Node.js解决方案:

Object.entries(require('foo')).forEach(([name, exported]) => global[name] = exported);

推荐阅读
低调pasta_730
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有