代码之家  ›  专栏  ›  技术社区  ›  Clay

导入CommonJS在ES6中无法正确销毁

  •  0
  • Clay  · 技术社区  · 7 年前

    在模块依赖项的根目录中,我有一个名为 form.js :

    module.exports = require("./dist/bundle.js").form;
    

    在我的项目中,我有:

    import { someComponent } from 'my-dependency/form';
    

    然而 someComponent undefined .

    如果我这样做:

    import form from 'my-dependency/form';
    console.log(form.someComponent);
    

    它将在控制台中输出如下内容:

    ƒ Rr(e){var t=e.component,n=void 0===t?"input":t,r=e.rend[....]
    

    但是,如果我这样做,它将起作用:

    import form from 'my-dependency/form';
    const { someComponent } = form;
    

    我在这里做错了什么?我怎样才能实现我想要的?

    我的内心 src/form.js 文件我有:

    import someComponent from "./someComponent";
    export default {
      someComponent
    };
    

    里面 src/index.js ,我有:

    import * as form from "./form";
    export default {
      form
    };
    

    可能的根本原因,但不确定如何解决?…

    它看起来像是由使用CommonJS导出和使用ES6语法导入引起的问题。

    这里有一个类似的问题,但4年前: https://github.com/google/traceur-compiler/issues/1483

    从两年前开始: https://github.com/Microsoft/TypeScript/issues/11179

    我曾尝试过显式地设置类似这样的代码,但这似乎没有达到我想要的效果(创建一个具有默认属性的模块):

    Object.defineProperty(module.exports, "__esModule", {
      value: true
    });
    

    看起来人们会在网上阅读 import * as whatever from '..' 但不应该破坏工作吗?……

    1 回复  |  直到 7 年前
        1
  •  3
  •   Ted    7 年前

    有两种方式:

    export const someComponent
    

    然后:

    import { someComponent } from 'my-dependency/form'
    

    或:

    export default {
      someComponent
    }
    

    然后:

    import someComponent from 'my-dependency/form'