feat(plugins): allow to import separate plugins
This commit is contained in:
parent
6cf8700fd9
commit
eb81c39f2c
|
@ -10,9 +10,8 @@ module.exports = {
|
||||||
]
|
]
|
||||||
],
|
],
|
||||||
plugins: [
|
plugins: [
|
||||||
process.env.PLUGINS && 'transform-es2015-modules-strip',
|
|
||||||
'@babel/proposal-object-rest-spread'
|
'@babel/proposal-object-rest-spread'
|
||||||
].filter(Boolean),
|
],
|
||||||
env: {
|
env: {
|
||||||
test: {
|
test: {
|
||||||
plugins: [ 'istanbul' ]
|
plugins: [ 'istanbul' ]
|
||||||
|
|
|
@ -0,0 +1,81 @@
|
||||||
|
/*!
|
||||||
|
* Script to build our plugins to use them separately.
|
||||||
|
* Copyright 2018 The Bootstrap Authors
|
||||||
|
* Copyright 2018 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
const rollup = require('rollup')
|
||||||
|
const path = require('path')
|
||||||
|
const babel = require('rollup-plugin-babel')
|
||||||
|
const TEST = process.env.NODE_ENV === 'test'
|
||||||
|
|
||||||
|
const plugins = [
|
||||||
|
babel({
|
||||||
|
exclude: 'node_modules/**', // Only transpile our source code
|
||||||
|
externalHelpersWhitelist: [ // Include only required helpers
|
||||||
|
'defineProperties',
|
||||||
|
'createClass',
|
||||||
|
'inheritsLoose',
|
||||||
|
'defineProperty',
|
||||||
|
'objectSpread'
|
||||||
|
]
|
||||||
|
})
|
||||||
|
]
|
||||||
|
|
||||||
|
const format = 'umd'
|
||||||
|
const rootPath = !TEST ? '../js/dist/' : '../js/coverage/dist/'
|
||||||
|
const bsPlugins = {
|
||||||
|
Alert: path.resolve(__dirname, '../js/src/alert.js'),
|
||||||
|
Button: path.resolve(__dirname, '../js/src/button.js'),
|
||||||
|
Carousel: path.resolve(__dirname, '../js/src/carousel.js'),
|
||||||
|
Collapse: path.resolve(__dirname, '../js/src/collapse.js'),
|
||||||
|
Dropdown: path.resolve(__dirname, '../js/src/dropdown.js'),
|
||||||
|
Modal: path.resolve(__dirname, '../js/src/modal.js'),
|
||||||
|
Popover: path.resolve(__dirname, '../js/src/popover.js'),
|
||||||
|
ScrollSpy: path.resolve(__dirname, '../js/src/scrollspy.js'),
|
||||||
|
Tab: path.resolve(__dirname, '../js/src/tab.js'),
|
||||||
|
Tooltip: path.resolve(__dirname, '../js/src/tooltip.js'),
|
||||||
|
Util: path.resolve(__dirname, '../js/src/util.js')
|
||||||
|
}
|
||||||
|
|
||||||
|
Object.keys(bsPlugins)
|
||||||
|
.forEach((pluginKey) => {
|
||||||
|
console.log(`Building ${pluginKey} plugin...`)
|
||||||
|
|
||||||
|
const external = ['jquery', 'popper.js']
|
||||||
|
const globals = {
|
||||||
|
jquery: 'jQuery', // Ensure we use jQuery which is always available even in noConflict mode
|
||||||
|
'popper.js': 'Popper'
|
||||||
|
}
|
||||||
|
|
||||||
|
// Do not bundle Util in plugins
|
||||||
|
if (pluginKey !== 'Util') {
|
||||||
|
external.push(bsPlugins.Util)
|
||||||
|
globals[bsPlugins.Util] = 'Util'
|
||||||
|
}
|
||||||
|
|
||||||
|
// Do not bundle Tooltip in Popover
|
||||||
|
if (pluginKey === 'Popover') {
|
||||||
|
external.push(bsPlugins.Tooltip)
|
||||||
|
globals[bsPlugins.Tooltip] = 'Tooltip'
|
||||||
|
}
|
||||||
|
|
||||||
|
rollup.rollup({
|
||||||
|
input: bsPlugins[pluginKey],
|
||||||
|
plugins,
|
||||||
|
external
|
||||||
|
}).then((bundle) => {
|
||||||
|
bundle.write({
|
||||||
|
format,
|
||||||
|
name: pluginKey,
|
||||||
|
sourcemap: true,
|
||||||
|
globals,
|
||||||
|
file: path.resolve(__dirname, `${rootPath}${pluginKey.toLowerCase()}.js`)
|
||||||
|
})
|
||||||
|
.then(() => console.log(`Building ${pluginKey} plugin... Done !`))
|
||||||
|
.catch((err) => console.error(`${pluginKey}: ${err}`))
|
||||||
|
})
|
||||||
|
})
|
|
@ -1411,12 +1411,6 @@
|
||||||
"integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=",
|
"integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"babel-plugin-transform-es2015-modules-strip": {
|
|
||||||
"version": "0.1.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-strip/-/babel-plugin-transform-es2015-modules-strip-0.1.1.tgz",
|
|
||||||
"integrity": "sha1-c5PwccNWod+2rAMHfgwGy1ejEl8=",
|
|
||||||
"dev": true
|
|
||||||
},
|
|
||||||
"babel-polyfill": {
|
"babel-polyfill": {
|
||||||
"version": "6.23.0",
|
"version": "6.23.0",
|
||||||
"resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.23.0.tgz",
|
"resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.23.0.tgz",
|
||||||
|
@ -4133,12 +4127,14 @@
|
||||||
"balanced-match": {
|
"balanced-match": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"brace-expansion": {
|
"brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"balanced-match": "^1.0.0",
|
"balanced-match": "^1.0.0",
|
||||||
"concat-map": "0.0.1"
|
"concat-map": "0.0.1"
|
||||||
|
@ -4153,17 +4149,20 @@
|
||||||
"code-point-at": {
|
"code-point-at": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"concat-map": {
|
"concat-map": {
|
||||||
"version": "0.0.1",
|
"version": "0.0.1",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"console-control-strings": {
|
"console-control-strings": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"core-util-is": {
|
"core-util-is": {
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
|
@ -4280,7 +4279,8 @@
|
||||||
"inherits": {
|
"inherits": {
|
||||||
"version": "2.0.3",
|
"version": "2.0.3",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"ini": {
|
"ini": {
|
||||||
"version": "1.3.5",
|
"version": "1.3.5",
|
||||||
|
@ -4292,6 +4292,7 @@
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"number-is-nan": "^1.0.0"
|
"number-is-nan": "^1.0.0"
|
||||||
}
|
}
|
||||||
|
@ -4306,6 +4307,7 @@
|
||||||
"version": "3.0.4",
|
"version": "3.0.4",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"brace-expansion": "^1.1.7"
|
"brace-expansion": "^1.1.7"
|
||||||
}
|
}
|
||||||
|
@ -4313,12 +4315,14 @@
|
||||||
"minimist": {
|
"minimist": {
|
||||||
"version": "0.0.8",
|
"version": "0.0.8",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"minipass": {
|
"minipass": {
|
||||||
"version": "2.2.4",
|
"version": "2.2.4",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"safe-buffer": "^5.1.1",
|
"safe-buffer": "^5.1.1",
|
||||||
"yallist": "^3.0.0"
|
"yallist": "^3.0.0"
|
||||||
|
@ -4337,6 +4341,7 @@
|
||||||
"version": "0.5.1",
|
"version": "0.5.1",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"minimist": "0.0.8"
|
"minimist": "0.0.8"
|
||||||
}
|
}
|
||||||
|
@ -4417,7 +4422,8 @@
|
||||||
"number-is-nan": {
|
"number-is-nan": {
|
||||||
"version": "1.0.1",
|
"version": "1.0.1",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"object-assign": {
|
"object-assign": {
|
||||||
"version": "4.1.1",
|
"version": "4.1.1",
|
||||||
|
@ -4429,6 +4435,7 @@
|
||||||
"version": "1.4.0",
|
"version": "1.4.0",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"wrappy": "1"
|
"wrappy": "1"
|
||||||
}
|
}
|
||||||
|
@ -4550,6 +4557,7 @@
|
||||||
"version": "1.0.2",
|
"version": "1.0.2",
|
||||||
"bundled": true,
|
"bundled": true,
|
||||||
"dev": true,
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"code-point-at": "^1.0.0",
|
"code-point-at": "^1.0.0",
|
||||||
"is-fullwidth-code-point": "^1.0.0",
|
"is-fullwidth-code-point": "^1.0.0",
|
||||||
|
|
|
@ -44,8 +44,8 @@
|
||||||
"js-compile": "npm-run-all --parallel js-compile-* --sequential js-copy",
|
"js-compile": "npm-run-all --parallel js-compile-* --sequential js-copy",
|
||||||
"js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js --sourcemap",
|
"js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js --sourcemap",
|
||||||
"js-compile-bundle": "rollup --environment BUNDLE:true --config build/rollup.config.js --sourcemap",
|
"js-compile-bundle": "rollup --environment BUNDLE:true --config build/rollup.config.js --sourcemap",
|
||||||
"js-compile-plugins": "cross-env PLUGINS=true babel js/src/ --out-dir js/dist/ --source-maps",
|
"js-compile-plugins": "node build/build-plugins.js",
|
||||||
"js-compile-plugins-coverage": "cross-env PLUGINS=true NODE_ENV=test babel js/src/ --out-dir js/coverage/dist/ --source-maps",
|
"js-compile-plugins-coverage": "cross-env NODE_ENV=test node build/build-plugins.js",
|
||||||
"js-minify": "npm-run-all --parallel js-minify-*",
|
"js-minify": "npm-run-all --parallel js-minify-*",
|
||||||
"js-minify-standalone": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.js.map,includeSources,url=bootstrap.min.js.map\" --output dist/js/bootstrap.min.js dist/js/bootstrap.js",
|
"js-minify-standalone": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.js.map,includeSources,url=bootstrap.min.js.map\" --output dist/js/bootstrap.min.js dist/js/bootstrap.js",
|
||||||
"js-minify-bundle": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.bundle.js.map,includeSources,url=bootstrap.bundle.min.js.map\" --output dist/js/bootstrap.bundle.min.js dist/js/bootstrap.bundle.js",
|
"js-minify-bundle": "uglifyjs --compress typeofs=false --mangle --comments \"/^!/\" --source-map \"content=dist/js/bootstrap.bundle.js.map,includeSources,url=bootstrap.bundle.min.js.map\" --output dist/js/bootstrap.bundle.min.js dist/js/bootstrap.bundle.js",
|
||||||
|
@ -103,7 +103,6 @@
|
||||||
"autoprefixer": "^8.6.5",
|
"autoprefixer": "^8.6.5",
|
||||||
"babel-eslint": "^8.2.5",
|
"babel-eslint": "^8.2.5",
|
||||||
"babel-plugin-istanbul": "^4.1.6",
|
"babel-plugin-istanbul": "^4.1.6",
|
||||||
"babel-plugin-transform-es2015-modules-strip": "^0.1.1",
|
|
||||||
"broken-link-checker": "^0.7.8",
|
"broken-link-checker": "^0.7.8",
|
||||||
"bundlesize": "^0.15.3",
|
"bundlesize": "^0.15.3",
|
||||||
"clean-css-cli": "^4.1.11",
|
"clean-css-cli": "^4.1.11",
|
||||||
|
|
|
@ -8,7 +8,9 @@ toc: true
|
||||||
|
|
||||||
## Individual or compiled
|
## Individual or compiled
|
||||||
|
|
||||||
Plugins can be included individually (using Bootstrap's individual `*.js` files), or all at once using `bootstrap.js` or the minified `bootstrap.min.js` (don't include both).
|
Plugins can be included individually (using Bootstrap's individual `js/dist/*.js`), or all at once using `bootstrap.js` or the minified `bootstrap.min.js` (don't include both).
|
||||||
|
|
||||||
|
If you use a bundler (Webpack, Rollup...), you can use `/js/dist/*.js` files which are UMD ready.
|
||||||
|
|
||||||
## Dependencies
|
## Dependencies
|
||||||
|
|
||||||
|
|
|
@ -22,7 +22,7 @@ Alternatively, you may **import plugins individually** as needed:
|
||||||
|
|
||||||
{% highlight js %}
|
{% highlight js %}
|
||||||
import 'bootstrap/js/dist/util';
|
import 'bootstrap/js/dist/util';
|
||||||
import 'bootstrap/js/dist/dropdown';
|
import 'bootstrap/js/dist/alert';
|
||||||
...
|
...
|
||||||
{% endhighlight %}
|
{% endhighlight %}
|
||||||
|
|
||||||
|
@ -30,11 +30,6 @@ Bootstrap is dependent on [jQuery](https://jquery.com/) and [Popper](https://pop
|
||||||
these are defined as `peerDependencies`, this means that you will have to make sure to add both of them
|
these are defined as `peerDependencies`, this means that you will have to make sure to add both of them
|
||||||
to your `package.json` using `npm install --save jquery popper.js`.
|
to your `package.json` using `npm install --save jquery popper.js`.
|
||||||
|
|
||||||
{% capture callout %}
|
|
||||||
Notice that if you chose to **import plugins individually**, you must also install [exports-loader](https://github.com/webpack-contrib/exports-loader)
|
|
||||||
{% endcapture %}
|
|
||||||
{% include callout.html content=callout type="warning" %}
|
|
||||||
|
|
||||||
## Importing Styles
|
## Importing Styles
|
||||||
|
|
||||||
### Importing Precompiled Sass
|
### Importing Precompiled Sass
|
||||||
|
|
Loading…
Reference in New Issue