How to include JS file from npm package to separate page in Nuxt.js

Question

I have several npm packages with client-side scripts I want to include to separate pages of my Nuxt.js project. I have tried to do that with:

<script>
export default {
  head: {
    script: [
      { src: "gojs/release/go.js", type: "text/javascript" }
    ]
  },

  // ...
}
</script>

but received 404 (Not Found) error. What is correct way to do that?

Try including the files as static assets (e.g., /assets/static/gojs/release/go.js), which will make them available at the root (/). Then in your .vue, the src url should be prefixed with / (/gojs/release/go.js). — tony19
– tony19, Commented Mar 4, 2019 at 19:17
Yes, I know about this way, but I want to include scripts from node_modules so when I update packages with npm - they will be updated. — Dmytro Zarezenko
– Dmytro Zarezenko, Commented Mar 6, 2019 at 16:20
Oh, I misunderstood. Normally, importing the module (e.g., with import go from 'gojs') and using it in your code are all you need to do for the build to include that dependency. See this demo — tony19
– tony19, Commented Mar 7, 2019 at 1:47

tony19 · Accepted Answer · 2019-03-07 22:59:08Z

1

Normally, import-ing the module (e.g., with import go from 'gojs') and using it in your code are all you need to do for the build to include that dependency. No need to add headers to load the NPM module.

Example in MyFoo.vue:

<script>
import go from 'gojs'

export default {
  mounted() {
    const $ = go.GraphObject.make;
    const myDiagram =
      $(go.Diagram, "myDiagramDiv",
        {
          "undoManager.isEnabled": true
        });

    ...
  }
}
</script>

demo

answered Mar 7, 2019 at 22:59

tony19

140k23 gold badges281 silver badges354 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to include JS file from npm package to separate page in Nuxt.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related