-
Notifications
You must be signed in to change notification settings - Fork 2
how do i
The default value of the names
option will cause all the compositions to be built, and only the root composition to be released. You need to set an explicit value.
You will probably want to set it from an environment variable, so that certain npm scripts can build different compositions.
The default behaviour is determined by the otherwise()
statement.
Simply remove test
from otherwise()
.
Refer to bower usage.
Change your vendor.js
file where the package is imported. Instead of importing the package wholesale, select specific files:
require('broken-package');
becomes:
// require('broken-package');
require('broken-package/dist/index.js');
You should first be aware of the structure and refer as needed to extensibility.
Append an operation to the common
definition. This operation should use the methods available on the webpack-configurator
instance.
For example, to add post-css to css loader (per their usage example), you would write a webpack.config.js
file:
var autoprefixer = require('autoprefixer');
var precss = require('precss');
...
module.exports = angularity(...)
.define('common')
.append(amendCssLoader)
.include(...)
.otherwise(...)
.resolve();
function amendCssLoader(configurator, options) {
return configurator
.removeLoader('css')
.loader('css', {
test : /\.css$/i,
loader: ExtractTextPlugin.extract('css?minimize&sourceMap!postcss!resolve-url?sourceMap')
}).
.merge({
postcss: function () {
return [autoprefixer, precss];
}
});
}
Wrapping numerous changes in a hoisted function adds clarity.
However since you don't need access to the options
so you could technically use the short form, omitting the amendCssLoader
function, but also losing some clarity.
Since webpack-configurator
tries to merge definitions you should always remove a loader that is being redefined (see below).
For example, to remove the jshint-loader pre-loader:
module.exports = angularity(...)
.define('common')
.append(removeLoader)
.include(...)
.otherwise(...)
.resolve();
function removeLoader(configurator, options) {
return configurator
.removePreLoader('linting');
}
In this case you have a single change that doesn't need access to the options
.
Consider using the short form, which omits the removeLoader
function:
var WebpackNotifierPlugin = require('webpack-notifier');
...
module.exports = angularity(...)
.define('app')
.removePreLoader('linting')
.include(...)
.otherwise(...)
.resolve();
For example, to add webpack-notifier plugin (per their usage example), you would write a webpack.config.js
file:
var WebpackNotifierPlugin = require('webpack-notifier');
...
module.exports = angularity(...)
.define('common')
.append(addPlugin)
.include(...)
.otherwise(...)
.resolve();
function addPlugin(configurator, options) {
return configurator
.plugin('notifier', WebpackNotifierPlugin, [{title: 'Webpack'}]);
}
In this case you have a single change that doesn't need access to the options
.
Consider using the short form, which omits the addPlugin
function:
var WebpackNotifierPlugin = require('webpack-notifier');
...
module.exports = angularity(...)
.define('common')
.plugin('notifier', WebpackNotifierPlugin, [{title: 'Webpack'}])
.include(...)
.otherwise(...)
.resolve();
Since webpack-configurator
tries to merge definitions you should always remove a plugin that is being redefined (see below).
For example, to remove the browser-sync plugin:
module.exports = angularity(...)
.define('app')
.append(removePlugin)
.include(...)
.otherwise(...)
.resolve();
function removePlugin(configurator, options) {
return configurator
.removePlugin('browser-sync');
}
In this case you have a single change that doesn't need access to the options
.
Consider using the short form, which omits the removePlugin
function:
var WebpackNotifierPlugin = require('webpack-notifier');
...
module.exports = angularity(...)
.define('app')
.removePlugin('browser-sync')
.include(...)
.otherwise(...)
.resolve();
-
Getting started
-
Reference
-
How it works