Как я могу получить полную строку моего JavaScript пакета UMD в оконной среде? `.toString ()` не работает - PullRequest
2 голосов
/ 25 февраля 2020

У меня есть пакет UMD моего пакета с именем utils, в нем есть только один метод с именем sum, например:

<script src="path/to/my/utils-umd.js"></script>
<script>
console.log(utils.sum([1,2,3]));
// => 6
</script>

Теперь я хочу получить полную строку моего источника UMD код, я не могу просто fetch('path/to/my/utils-umd.js') по какой-то причине, поэтому мне нужно синхронно получить строку пакета UMD.

Я пробовал несколько вещей, но не повезло, вот некоторые из них:

window.utils.toString();
// => "[object Module]"
Object.prototype.toString.call(window.utils);
// => "[object Module]"
typeof window.utils;
// => "object"
JSON.stringify(window.utils)
// => "{}"

Вот мой полный исходный код пакета UMD:

(function(e, t) {
  'object' === typeof exports && 'object' === typeof module
    ? (module.exports = t())
    : 'function' === typeof define && define.amd
    ? define([], t)
    : 'object' === typeof exports
    ? (exports['utils'] = t())
    : (e['utils'] = t());
})('undefined' !== typeof self ? self : this, function() {
  return (function(e) {
    var t = {};
    function n(r) {
      if (t[r]) return t[r].exports;
      var o = (t[r] = { i: r, l: !1, exports: {} });
      return e[r].call(o.exports, o, o.exports, n), (o.l = !0), o.exports;
    }
    return (
      (n.m = e),
      (n.c = t),
      (n.d = function(e, t, r) {
        n.o(e, t) || Object.defineProperty(e, t, { enumerable: !0, get: r });
      }),
      (n.r = function(e) {
        'undefined' !== typeof Symbol &&
          Symbol.toStringTag &&
          Object.defineProperty(e, Symbol.toStringTag, { value: 'Module' }),
          Object.defineProperty(e, '__esModule', { value: !0 });
      }),
      (n.t = function(e, t) {
        if ((1 & t && (e = n(e)), 8 & t)) return e;
        if (4 & t && 'object' === typeof e && e && e.__esModule) return e;
        var r = Object.create(null);
        if (
          (n.r(r),
          Object.defineProperty(r, 'default', { enumerable: !0, value: e }),
          2 & t && 'string' != typeof e)
        )
          for (var o in e)
            n.d(
              r,
              o,
              function(t) {
                return e[t];
              }.bind(null, o)
            );
        return r;
      }),
      (n.n = function(e) {
        var t =
          e && e.__esModule
            ? function() {
                return e['default'];
              }
            : function() {
                return e;
              };
        return n.d(t, 'a', t), t;
      }),
      (n.o = function(e, t) {
        return Object.prototype.hasOwnProperty.call(e, t);
      }),
      (n.p = ''),
      n((n.s = 'fae3'))
    );
  })({
    f6fd: function(e, t) {
      (function(e) {
        var t = 'currentScript',
          n = e.getElementsByTagName('script');
        t in e ||
          Object.defineProperty(e, t, {
            get: function() {
              try {
                throw new Error();
              } catch (r) {
                var e,
                  t = (/.*at [^\(]*\((.*):.+:.+\)$/gi.exec(r.stack) || [!1])[1];
                for (e in n)
                  if (n[e].src == t || 'interactive' == n[e].readyState)
                    return n[e];
                return null;
              }
            }
          });
      })(document);
    },
    fae3: function(e, t, n) {
      'use strict';
      var r;
      (n.r(t), 'undefined' !== typeof window) &&
        (n('f6fd'),
        (r = window.document.currentScript) &&
          (r = r.src.match(/(.+\/)[^/]+\.js(\?.*)?$/)) &&
          (n.p = r[1]));
      function o(e) {
        return e.reduce(function(e, t) {
          return e + t;
        }, 0);
      }
      n.d(t, 'sum', function() {
        return o;
      });
    }
  });
});
//# sourceMappingURL=utils.umd.min.js.map

Возможно ли это сделать?

Ответы [ 3 ]

2 голосов
/ 25 февраля 2020

Вы можете получить исходный код функции только с помощью метода toString, который вы можете попытаться заставить весь пакет UMD запускать в функции с именем, тогда вы сможете получить исходный код, используя toString для пример:

function foo() {
  console.log('foo')
  return true;
}
document.getElementById('res').innerText = foo.toString();
<div id="res">
  aaaaaaaaaa
</div>
1 голос
/ 25 февраля 2020

Я не могу просто получить ('path / to / my / utils-umd. js') по какой-то причине

Если вы можете загрузить скрипт через <script src='?'>, тогда я не вижу причин, по которым fetch не будет работать.

Ниже приведен пример загрузки jquery в текстовую область с использованием fetch ..

const jqueryurl = 'https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js';

async function getjquerySrc() {
  document.querySelector('textarea').value =
    await(await fetch(jqueryurl)).text();
}

getjquerySrc();
    
textarea {
  width: 100%;
}
<textarea rows=10>
</textarea>
0 голосов
/ 25 февраля 2020

Используя XMLHttpRequest, я получаю JS файл в строку Надеюсь, это поможет вам.

  <script src="utils-umd.js"></script>
    <script>
    var client = new XMLHttpRequest();
    client.open('GET', 'utils-umd.js');
    client.onreadystatechange = function() {
      console.log(client.responseText);
    }
    client.send();
    </script>
...