Grapesjs: [FeatureRequest] Allow to import javascript modules

Created on 25 Sep 2019  路  1Comment  路  Source: artf/grapesjs

When using Ionic StencilJS, the components are imported using the new module support:

<script type="module" src="http://localhost:3333/build/grapejspoc.esm.js"></script>
<script nomodule="" src="http://localhost:3333/build/grapejspoc.js"></script>

On {canvas: scripts: []} I can only load external scripts by their url.
To cover such case, we could import modules as this:

canvas: {
  scripts: [
    { src: "https://pagecdn.io/lib/jquery/3.4.1/jquery.min.js", integrity: "sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=", crossorigin="anonymous" },
    { type: "module", src: "https://bla/bla.esm.js"},
    { nomodule: "", src: "https://bla/bla.js" }
  ]
}

The final result inside canvas would be:

<script src="https://pagecdn.io/lib/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type="module" src="http://bla/bla.esm.js"></script>
<script nomodule="" src="http://bla/bla.js"></script>

Notice that this would cover also the case when we want to use integrity or crossorigin in <script> tags and, of course, inserting a url string would still work as it is today.

help wanted

Most helpful comment

Nice I like it, for anyone interested in making a PR the code to update is here:
https://github.com/artf/grapesjs/blob/aee18dcf0602e5d56e7670deb8d4ffbf31c73008/src/canvas/view/CanvasView.js#L140-L161

>All comments

Nice I like it, for anyone interested in making a PR the code to update is here:
https://github.com/artf/grapesjs/blob/aee18dcf0602e5d56e7670deb8d4ffbf31c73008/src/canvas/view/CanvasView.js#L140-L161

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ionic666 picture ionic666  路  3Comments

mathiasbc picture mathiasbc  路  3Comments

faizansaiyed picture faizansaiyed  路  3Comments

Geczy picture Geczy  路  3Comments

kosirm picture kosirm  路  3Comments