0

所以我有一个反应组件,我试图发布到 npm 注册表中。它是一个简单的组件,它决定了要渲染的组件,并且所有要渲染的选项都是由我公司中的其他人创建并从 npm 注册表导入的。

问题是,当我构建我的组件并尝试使用它时,它不起作用并给我下一个错误:

    ./node_modules/@corp/foo/dist/component.es.js
    SyntaxError: /Users/225336/Documents/corp/projektit/react-test- 
    app/test-app/node_modules/@corp/component/dist/component.es.js: Identifier 
    '___$insertStyle' has already been declared (86:9)

      84 | }
      85 | 
    > 86 | function ___$insertStyle(css) {
         |          ^

当我查看component.es.js时,我看到它为每个导入的组件和一个为我的父组件创建了 ___$insertStyle(css) 函数,但是前两个在它们之后没有标识号,因此它们重叠

    function ___$insertStyle(css) {
      if (!css) {
        return;
      }
      if (typeof window === 'undefined') {
        return;
      }

      var style = document.createElement('style');

      style.setAttribute('type', 'text/css');
      style.innerHTML = css;
      document.head.appendChild(style);

      return css;
    }

    ...

    function ___$insertStyle(css) {
      if (!css) {
        return;
      }
      if (typeof window === 'undefined') {
        return;
      }

      var style = document.createElement('style');

      style.setAttribute('type', 'text/css');
      style.innerHTML = css;
      document.head.appendChild(style);

      return css;
    }

    ___$insertStyle(".1-embed-container...");

    ...

    function ___$insertStyle$1(css) {
      ...
    }

    ...

    ___$insertStyle$1(".2-embed-container...");

    ...

    function ___$insertStyle$2(css) {
      ...
    }

    ...

    ___$insertStyle$2(".at-embed{padding:14px;line-height:1.4;font-family:Bernino Sans,Verdana,sans-serif}.at-embed div{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.at-embed h4{margin:0 0 5px}.at-embed h6{margin:0;font-size:13px;font-weight:700}.at-embed img{display:none}.at-embed article{border-left:4px solid #999;padding:2px 0 2px 10px;margin-bottom:10px;clear:both}.at-embed article,.at-embed article:first-child{-webkit-flex:1 0 100%;-ms-flex:1 0 100%;flex:1 0 100%;margin-right:20px}.at-embed article:first-child{margin-bottom:20px;border:0;padding:0}.at-embed article:first-child a{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.at-embed article:first-child h6{font-size:15px;line-height:1.2}.at-embed article:first-child img{display:block;margin-right:14px;width:40%}.at-embed article:last-child{margin:0}@media (min-width:420px){.at-embed article:first-child h6{font-size:18px}}@media (min-width:840px){.at-embed article{-webkit-flex:1 1 135px;-ms-flex:1 1 135px;flex:1 1 135px;border:0;padding:0}.at-embed article img{display:block;margin:0 0 10px}.at-embed article:first-child h6{font-size:22px}}.at-embed-kl article{border-color:#00c4e0}.at-embed-te article{border-color:#eb1c22}.at-embed-mb article{border-color:#4068ad}.at-embed-mb svg path{fill:#4068ad}");

    ...

什么可能导致它,我该如何解决?手动删除重复功能之一可以解决问题,但这显然不是正确的方法。

4

1 回答 1

0

通过使用 webpack 而不是汇总来“修复”它。

于 2019-05-24T07:38:10.540 回答