vue-server-render | This is a basic set-up for a SSR using vue-router | Server Side Rendering library

When I use @apply in my style tag like that:

I have following package.json

I am developing an instantsearch using nuxt. Googlemaps receives the first set on results on page load and renders the markers without any issues - however when searching the new results do not update on the map? Is there a way i can push the new set of results through to the map to render the markers?

I assume this will be the beforeMount hook and pass the results to updateMap?

pages/index.vue

I'm having issues deploying my Nuxt static site (build with Bootstrap Vue and using Wordpress Rest API) to Netlify using Github. When I deploy it manually it works just as expected. But when I use Github it gives me the "Page Not Found-message" for most of the pages and for those pages that don't get that error it doesn't provide all the page content.

I have followed the Nuxt configure for a statically generated site: [https://nuxtjs.org/deployments/netlify/#for-a-statically-generated-site][1]. I have also tried to change the NODE_VERSION environment variable but without success. Does anyone have a suggestion for a solution to this problem?

This is the deploy log from Netlify

I am developing a Drawflow application using Vuejs/Nuxtjs based on the code mentioned here. When I install the package element-plus and start the application then I get the error:

I've recently added the @nuxtjs/date-fns module to my app. My goal was to format in different languages a date into a human-readable format like "Friday, 13th of July 2042".

For language translation, I am using the @nuxtjs/i18n module.

Here is the problematic chunk of code when I try to generate statically:

I’m using Nuxt.js to create a full static landing page and i’m also using Three.js to render a 3d Globe in the page, everything works correct in dev mode and production mode in local, but when i try to deploy to netlify using yarn generate to create a full static site, it shows this error:

function (exports, require, module, __filename, __dirname) { import { SyntaxError: Cannot use import statement outside a module at new Script (vm.js:88:7) at createScript (vm.js:261:10) at Object.runInThisContext (vm.js:309:10) at wrapSafe (internal/modules/cjs/loader.js:1040:15) at Module._compile (internal/modules/cjs/loader.js:1101:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10) at Module.load (internal/modules/cjs/loader.js:985:32) at Function.Module._load (internal/modules/cjs/loader.js:878:14) at Module.require (internal/modules/cjs/loader.js:1025:19) at require (internal/modules/cjs/helpers.js:72:18) at /Users/herow/Web-Projects/arpen-technologies/node_modules/vue-server-renderer/build.prod.js:1:77662 at Object. (webpack:/external "three/examples/jsm/controls/OrbitControls.js":1:0) at __webpack_require__ (webpack/bootstrap:25:0) at Module.37 (pages/index.js:22:25) at __webpack_require__ (webpack/bootstrap:25:0) at Module.38 (pages/index.vue:21:0)

This makes references to the imports that i’m doing in the Three.js component:

import * as THREE from 'three'

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'

import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js'

import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js'

import { GlitchPass } from 'three/examples/jsm/postprocessing/GlitchPass.js'

Here i’m importing the plugins from the jsm folder, i have tried importing this from the js folder but then i get THREE is not defined error.

I don’t know what does it mean. Please guide me.

I have created a Vue3 application using the Vue CLI to create my application with Vuex and Router. The application runs well.

Note: I followed this useful doc for the Vuex with Vue3 https://blog.logrocket.com/using-vuex-4-with-vue-3/

Requirement Now I would like to change my Vue3 application to have Server Side Rendering support(i.e. SSR).

I watched this awesome video on creating an SSR application using Vue3 : https://www.youtube.com/watch?v=XJfaAkvLXyU and I can create and run a simple application like in the video. However I am stuck when trying to apply it to my main Vue3 app.

My current sticking point is how to specify the router and vuex on the server code.

My Code

The client entry file (src/main.js) has the following

It happens when add in .vue file.