Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by mdf

  1. Chalk this up to needing to take a step back. You're right, I did not need to be using during the headless render. I should have been adding it when the server-side code is hydrated with the client-side code. 


    If anyone comes across a similar problem, I was able to load the plugin successfully by adding the following to my nuxt.config file:


    build: {
      extend (config, ctx) {
        if (ctx.isClient) {
          config.entry.app = ['gsap','~plugins/DrawSVGPlugin', config.entry.app];


    • Like 1
  2. Hi, all. When I try to import the DrawSVGPlugin to a NuxtJS project, I get the following error:

    TypeError: Cannot read property 'defaultView' of undefined
        at /Users/mdf/Sites/nuxtproject/node_modules/gsap/DrawSVGPlugin.js:19:27
        at Object.<anonymous> (/Users/mdf/Sites/nuxtproject/node_modules/gsap/DrawSVGPlugin.js:202:54)
        at Module._compile (module.js:569:30)
        at Object.Module._extensions..js (module.js:580:10)
        at Module.load (module.js:503:32)
        at tryModuleLoad (module.js:466:12)
        at Function.Module._load (module.js:458:3)
        at Module.require (module.js:513:17)
        at require (internal/module.js:11:18)
        at r (/Users/mdf/Sites/nuxtproject/node_modules/vue-server-renderer/build.js:5812:16)
        at Object.<anonymous> (webpack:/external "gsap/DrawSVGPlugin":1:0)
        at __webpack_require__ (webpack:/webpack/bootstrap 8aad739dc52752aa5015:25:0)
        at Object.70 (2.server-bundle.js:123:77)
        at __webpack_require__ (webpack:/webpack/bootstrap 8aad739dc52752aa5015:25:0)
        at Object.61 (pages/index.vue:7:0)
        at __webpack_require__ (webpack:/webpack/bootstrap 8aad739dc52752aa5015:25:0)

    The error is related to the call to `_doc.defaultView` and only happens when the page is server rendered, not when it is client rendered. I'm not sure if there is an issue with the vue-server-renderer package or if I'm not importing the plugin correctly. I've tried importing the plugin from the assets folder


    import TweenLite from 'gsap';
    import '~/assets/DrawSVGPlugin';


    as well as copying it into the gsap folder in node_modules 


    import TweenLite from 'gsap';
    import 'gsap/DrawSVGPlugin';


    Both produce the same error. The error is also not Nuxt-specific but happens whenever Vue server-side rendering is used. 


    I put together a bare-bones example to illustrate the problem here https://github.com/michaeldfoley/vue-ssr-drawsvgplugin-error. Any help would be appreciated.