Suppor for SSR

[melliott03]

How would you import this for Server Side Rendering?

[dennisbruner]

If you use Nuxt.js you can check for the variable process.browser before trying to show notifications:

// ...

if (process.browser) {
  this.$notification.show('Hello World', {
    body: 'This is an example!'
  }, {})
}

// ...

[rianmartins]

Build for SSR fails with the following message:

\node_modules\vue-native-notification\index.js:124 export default VueNativeNotification ^^^^^^ SyntaxError: Unexpected token 'export' It seems to me that webpack is not being able to transpile the code to common js. There's any configuration on the vue-native-notification package for SSR? **Ps.:** I'm not using Nuxt **Steps to reproduce:** 1) Start a SSR project like the following tutorial: https://vuejsdevelopers.com/2017/12/11/vue-ssr-router/ 2) Run "npm start" to see the initial SSR project working 3) Stop project and install vue-native-notification 3.1) Run "npm install vue-native-notification" 3.2) Add `import VueNativeNotification from 'vue-native-notification'` to main.js 3.3) Add `Vue.use(VueNativeNotification, { requestOnNotify: true });` to main.js 4) Try to run the project again with "npm start" 5) This will throw the error mentioned above Am I missing any configuration on the webpack or babel or someplace else in order to make it work with SSR? Many thanks in advance!

[dennisbruner]

Are you using any other plugins or just this one? @rianmartins

[rianmartins]

Are you using any other plugins or just this one? @rianmartins

I tried to create a new project from scratch using SSR (just by following the tutorial at https://vuejsdevelopers.com/2017/12/11/vue-ssr-router/) and installed only this plugin and it already gave me this error:

\node_modules\vue-native-notification\index.js:124 export default VueNativeNotification ^^^^^^ SyntaxError: Unexpected token 'export'

[dennisbruner]

Try setting modules to true in the .babelrc file like this:

{
  "presets": [
    ["env", { "modules": true }],
    "stage-3"
  ]
}

[rianmartins]

Try setting modules to true in the .babelrc file like this:

{
  "presets": [
    ["env", { "modules": true }],
    "stage-3"
  ]
}

I tried a bunch of different configs, I can't even list all of my attempts. But what you suggests throws an error:

Module build failed: Invariant Violation: Invalid Option: The 'modules' option must be either 'false' to indicate no modules, or a
    module type which can be be one of: 'commonjs' (default), 'amd', 'umd', 'systemjs'

All of the options for env modules in .babelrc (false. 'commonjs', 'amd', 'umd' and 'systemjs') gives the same error after the build (while starting the server):

> vue-ssr@1.0.0 start-server absolute\path\to\project\vue-ssr
> node server.js

absolute\path\to\project\vue-ssr\node_modules\vue-native-notification\index.js:124
export default VueNativeNotification
^^^^^^

SyntaxError: Unexpected token 'export'