diff --git a/docs/markdown/intro/README.md b/docs/markdown/intro/README.md index d9e0fffa634..919ea6aea4a 100644 --- a/docs/markdown/intro/README.md +++ b/docs/markdown/intro/README.md @@ -56,7 +56,7 @@ _after_ Bootstrap SCSS to ensure variables are set up correctly. **Note**: _Requires webpack configuration to load CSS/SCSS files ([official guide](https://webpack.js.org/guides/asset-management/#loading-css))_. -## Nuxt.js plugin module +## Nuxt.js Module [Nuxt.js](https://nuxtjs.org) version {{ nuxtVersion }} (or greater) is recommended. @@ -153,6 +153,14 @@ module.exports = { } ``` +### Using pretranspiled version of BootstrapVue for Nuxt.js + +Nuxt module uses precompiled version of BootstrapVue for faster development builds and source of +BootstrapVue for higher quality production builds. + +You can override this option using `usePretranspiled` option. Setting to `true` uses `es/` instead +of `src/`. By default is enabled for development mode only. + ## Vue CLI 2 BootstrapVue has two Vue CLI templates available: diff --git a/nuxt/index.js b/nuxt/index.js index 735e7233a07..db9fd311f78 100644 --- a/nuxt/index.js +++ b/nuxt/index.js @@ -47,10 +47,15 @@ module.exports = function nuxtBootstrapVue(moduleOptions = {}) { this.options.css.unshift('bootstrap/dist/css/bootstrap.css') } - // Transpile src + // Transpile src/ this.options.build.transpile.push('bootstrap-vue/src') - const templateOptions = {} + // Use es/ or src/ + const usePretranspiled = pickFirst(options.usePretranspiled, this.options.dev) + + const templateOptions = { + dist: usePretranspiled ? 'es' : 'src' + } // TODO: Also add support for individual components & directives for (const type of ['componentPlugins', 'directivePlugins']) { diff --git a/nuxt/plugin.template.js b/nuxt/plugin.template.js index 4b5b4123f51..db2a857fae9 100644 --- a/nuxt/plugin.template.js +++ b/nuxt/plugin.template.js @@ -1,10 +1,10 @@ import Vue from 'vue' <% if (options.componentPlugins.length || options.directivePlugins.length) { %><%= -options.componentPlugins.reduce((acc, p) => (acc += `import ${p[0]} from 'bootstrap-vue/es/components/${p[1]}'\n` ), '') %><%= -options.directivePlugins.reduce((acc, p) => (acc += `import ${p[0]} from 'bootstrap-vue/es/directives/${p[1]}'\n` ), '') %> +options.componentPlugins.reduce((acc, p) => (acc += `import ${p[0]} from 'bootstrap-vue/${options.dist}/components/${p[1]}'\n` ), '') %><%= +options.directivePlugins.reduce((acc, p) => (acc += `import ${p[0]} from 'bootstrap-vue/${options.dist}/directives/${p[1]}'\n` ), '') %> <% if (options.config) { %> -import BVConfigPlugin from 'bootstrap-vue/es/bv-config' +import BVConfigPlugin from 'bootstrap-vue/<%= options.dist %>/bv-config' Vue.use(BVConfigPlugin, <%= JSON.stringify(options.config, undefined, 2) %>) <% } %> @@ -13,7 +13,7 @@ Vue.use(BVConfigPlugin, <%= JSON.stringify(options.config, undefined, 2) %>) options.componentPlugins.reduce((acc, p) => (acc += `Vue.use(${p[0]})\n` ), '') %><%= options.directivePlugins.reduce((acc, p) => (acc += `Vue.use(${p[0]})\n` ), '') %> <% } else { %> -import BootstrapVue from 'bootstrap-vue/es' +import BootstrapVue from 'bootstrap-vue/<%= options.dist %>' Vue.use(BootstrapVue, <%= JSON.stringify(options.config || {}, undefined, 2) %>) <% } %>