michalzaq12 / electron-nuxt

⚡ An Electron & Nuxt.js / Vue.js quick start boilerplate with vue-cli scaffolding, electron-builder, unit/e2e testing, vue-devtools
https://michalzaq12.github.io/electron-nuxt
MIT License
721 stars 78 forks source link

Instructions for adding electron-nuxt to existing nuxt project? #389

Open xinbenlv opened 4 years ago

xinbenlv commented 4 years ago

Hi Michal, this is awesome, I wonder if there are instructions for adding electron-nuxt to existing nuxt project that we can follow?

Alexpinilla commented 4 years ago

That is the most usual case. Please it would be nice to focus on give a solution for this!

minute-med commented 3 years ago

Hi, i had the same use case and its probably not the best way to go but i simply

NB:

Then i had my project up and working Hope this help

nwittwer commented 3 years ago

@michalzaq12 What if there was a CLI solution for electron-nuxt, similar to Storybook's CLI sb init command? They also use a similar structure, with .storybook/ containing the library files, and I think it also checks package versions for compatibility.

A CLI solution could be extended to also cover updating electron-nuxt (since that's similarly a very manual process currently). Using a similar solution to Storybook's CLI, where one can run sb upgrade. They put together some easy-to-follow migration guides when a new version comes out.

M-Barari commented 3 years ago

Hi, i had the same use case and its probably not the best way to go but i simply

  • copy / pasted my nuxt files in the src/renderer/ folder (except nuxt.config.js)
  • updated the electron-nuxt project's nuxt.config.js file with the config of my previous nuxt project
  • added the npm packages i was using on my nuxt project with yarn
  • yarn install & yarn dev

NB:

  • For some reason with electron-nuxt you can't use(by default) import / export synthax in electron-nuxt's nuxt.config.js file (so becarefull not to copy/pase your nuxt project's nuxt.config.js file cause its use import / export synthax)
  • I'm was using vee-validate package for input validation and i had to specify in nuxt.config.js to transpilate a specific folder (vee-validate/dist/rules) during build in order to avoid the unexpected token export error (cf https://vee-validate.logaretm.com/v3/guide/rules.html#importing-rules-in-nuxt-js).
build: {
    // https://vee-validate.logaretm.com/v3/guide/rules.html#importing-rules-in-nuxt-js
    transpile: ['vee-validate/dist/rules'],
  },

I don't know why but with electron-nuxt the above config in nuxt.config.js is ignored. as a workaround i used thte .umd version of the rules files of the same folder.

Then i had my project up and working Hope this help

@ErwanTouba so how did you solve import in nuxt.config.js file?? I can't just remove it! and about vee-validate , can you explain more how to solve that?? tanx

wimil commented 2 years ago

Hi, i had the same use case and its probably not the best way to go but i simply

  • copy / pasted my nuxt files in the src/renderer/ folder (except nuxt.config.js)
  • updated the electron-nuxt project's nuxt.config.js file with the config of my previous nuxt project
  • added the npm packages i was using on my nuxt project with yarn
  • yarn install & yarn dev

NB:

  • For some reason with electron-nuxt you can't use(by default) import / export synthax in electron-nuxt's nuxt.config.js file (so becarefull not to copy/pase your nuxt project's nuxt.config.js file cause its use import / export synthax)
  • I'm was using vee-validate package for input validation and i had to specify in nuxt.config.js to transpilate a specific folder (vee-validate/dist/rules) during build in order to avoid the unexpected token export error (cf https://vee-validate.logaretm.com/v3/guide/rules.html#importing-rules-in-nuxt-js).
build: {
    // https://vee-validate.logaretm.com/v3/guide/rules.html#importing-rules-in-nuxt-js
    transpile: ['vee-validate/dist/rules'],
  },

I don't know why but with electron-nuxt the above config in nuxt.config.js is ignored. as a workaround i used thte .umd version of the rules files of the same folder. Then i had my project up and working Hope this help

@ErwanTouba so how did you solve import in nuxt.config.js file?? I can't just remove it! and about vee-validate , can you explain more how to solve that?? tanx

I have the same problem, someone found a solution?

shokmaster commented 1 year ago

About import, you just need to convert it into require:

import moment from 'moment';

const moment = require('moment');

Hope this help!