Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript es6-导入所有不带别名的命名模块_Javascript_Reactjs - Fatal编程技术网

Javascript es6-导入所有不带别名的命名模块

Javascript es6-导入所有不带别名的命名模块,javascript,reactjs,Javascript,Reactjs,我知道我们可以导入所有别名为的命名模块,如下所示 import * as name from "module-name"; 参考: 实际上,我已经在A.js中重新导出了我的模块,而在B.js中也继承了同样的模块。PFB。现在,它是两级继承,所以导入命名模块并不是什么大问题。但是,当我将其转换为5级继承(A->B->C->D->E)时,我需要导入所有文件中的所有命名模块,并且需要(重新)导出所有文件中相同的模块。而不是这样做 是否有其他方法可以将所有命名模块的范围复制到所有级别,而无需重复控制

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

import * as name from "module-name";
参考:

实际上,我已经在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 {}
是否有任何方法可以导入所有没有别名的命名模块,例如从“/A”导入{*}(而不是B.js中的第二个)

是否有任何方法可以导入所有没有别名的命名模块,例如从“./A”(而不是B.js中的第二个)导入{*}

没有

正如您在上一篇文章中所说的,重新导出的整个想法超过了在最终js文件中保存“行数”的需要

因为,它在最终的js文件中为每个导入放两行。考虑到如果有10条导入线,则在最终JS中添加20行。当你考虑生产时,成本太高

没有多大意义,因为这就是JS迷你们的用途

总结一下:一开始就不应该这样做:

  • 只导出需要导出的内容
  • 您可以在任何需要的地方导入所需的内容
  • 您可以使用JS缩小器优化输出JS文件的大小
  • 是否有任何方法可以导入所有没有别名的命名模块,例如从“./A”(而不是B.js中的第二个)导入{*}

    没有

    正如您在上一篇文章中所说的,重新导出的整个想法超过了在最终js文件中保存“行数”的需要

    因为,它在最终的js文件中为每个导入放两行。考虑到如果有10条导入线,则在最终JS中添加20行。当你考虑生产时,成本太高

    没有多大意义,因为这就是JS迷你们的用途

    总结一下:一开始就不应该这样做:

  • 只导出需要导出的内容
  • 您可以在任何需要的地方导入所需的内容
  • 您可以使用JS缩小器优化输出JS文件的大小

  • 这是我做的一个疯狂的实验,它是有效的,但它可能以我不完全理解的方式存在危险。 有人能解释一下我们为什么不这么做吗

    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["_"]
      ;
    
    此列表中有一些示例说明了这是一个坏主意的原因(例如,它隐藏了
    参数

    您应该能够按如下方式使用它(尽管您可能不喜欢上面所说的)

    B.js
    无论如何,我忍不住要尝试一下;)

    我做了一个疯狂的实验,它很有效,但在我不完全理解的方面,它可能很危险。 有人能解释一下我们为什么不这么做吗

    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["_"]
      ;
    
    此列表中有一些示例说明了这是一个坏主意的原因(例如,它隐藏了
    参数

    您应该能够按如下方式使用它(尽管您可能不喜欢上面所说的)

    B.js
    无论如何,我忍不住要尝试一下;)

    目前,还没有干净的方法可以做到这一点。 但您可以通过以下方式克服此问题:

    1) 定义别名

    import * as foo from "foo"
    
    2) 编写所有模块

    import {a,b,c,d,...} from "foo"
    

    目前,还没有干净的方法可以做到这一点。 但您可以通过以下方式克服此问题:

    1) 定义别名

    import * as foo from "foo"
    
    2) 编写所有模块

    import {a,b,c,d,...} from "foo"
    
    JavaScript解决方案:

    import * as exports from 'foo';
    Object.entries(exports).forEach(([name, exported]) => window[name] = exported);
    
    Object.entries(require('foo')).forEach(([name, exported]) => global[name] = exported);
    
    注意:导入的包装器对象仍保留在那里


    Node.js解决方案:

    import * as exports from 'foo';
    Object.entries(exports).forEach(([name, exported]) => window[name] = exported);
    
    Object.entries(require('foo')).forEach(([name, exported]) => global[name] = exported);
    
    JavaScript解决方案:

    import * as exports from 'foo';
    Object.entries(exports).forEach(([name, exported]) => window[name] = exported);
    
    Object.entries(require('foo')).forEach(([name, exported]) => global[name] = exported);
    
    注意:导入的包装器对象仍保留在那里


    Node.js解决方案:

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

    global
    是node.js中的当前作用域,类似于浏览器中的
    窗口
    对象,因此可以导入到此对象中

    要从util模块导入所有符号,请执行以下操作:

    import * as util from "./util";
    util.importAll(util, global);
    
    在util.js中:

    /**
     * Takes all functions/objects from |sourceScope|
     * and adds them to |targetScope|.
     */
    function importAll(sourceScope, targetScope) {
      for (let name in sourceScope) {
        targetScope[name] = sourceScope[name];
      }
    }
    

    。。。还有许多其他函数,比如
    assert()
    等等,我在任何地方都需要这些函数,它们应该是JavaScript语言的一部分,但现在还没有。但正如其他人所说,请谨慎使用。

    global
    是node.js中当前的作用域,类似于浏览器中的
    窗口
    对象,因此可以导入到该对象中

    要从util模块导入所有符号,请执行以下操作:

    import * as util from "./util";
    util.importAll(util, global);
    
    在util.js中:

    /**
     * Takes all functions/objects from |sourceScope|
     * and adds them to |targetScope|.
     */
    function importAll(sourceScope, targetScope) {
      for (let name in sourceScope) {
        targetScope[name] = sourceScope[name];
      }
    }
    

    。。。还有许多其他函数,比如
    assert()
    等等,我在任何地方都需要这些函数,它们应该是JavaScript语言的一部分,但现在还没有。但正如其他人所说,要谨慎使用。二号。为什么要重新导出全球可用的模块?例如:如果我没有在A.js中重新导出I18n,我就不能在B.js中使用相同的模块。但是,我可以在B.js中导入这一行之后使用I18n(从“i18njs”导入I18n)。我不想这么做。“我不想这么做。”---因为?我很不明白你为什么要把刚进口的东西再出口。。那没有道理!你上面关于不能在B中使用同一个模块的评论似乎不正确,“100个组件*每个至少10个导入=1000*2=最终js中的2000行。”---这个假设是不正确的。如果你的问题与建立一个