Installation
npm install @febe95/vue-js-modal --save
Client
Import plugin in your main file:
import VModal from '@febe95/vue-js-modal'
OR
import VModal from '@febe95/vue-js-modal/dist/index.nocss.js'
import '@febe95/vue-js-modal/dist/styles.css'
app.use(VModal)
SSR
To use this plugin with Nuxt.js you need to create a plugin file and reference it in the nuxt.config.js file.
// nuxt.config.js
export default {
...
/*
** Plugins to load before mounting the App
*/
plugins: [
'~plugins/vue-js-modal.js'
],
}
// plugins/vue-js-modal.js
import { defineNuxtPlugin } from 'nuxt/app'
import VModal from '../../../dist/ssr.nocss'
import '../../../dist/styles.css'
export default defineNuxtPlugin((nuxtApp) => {
nuxtApp.vueApp.use(VModal)
})
Extracted CSS
The /dist directory contains a version of the build with extracted CSS files. This is useful for SSR but also can be used with the purely client-side implementation when you need more flexibility in controlling your stylesheets.
ssr.index.js- SSR build with inline CSSssr.nocss.js- SSR build without inline CSSindex.nocss.js- Client build without inline CSSstyles.css- Stylesheet