Webpack asset pipeline hook for Sails.
$ npm install sails-webpack --save// .sailsrc
{
"hooks": {
"grunt": false
}
}By default, Sails (and express) sets NODE_ENV=development.
In this setting, webpack will watch for changes in the directories you specify in your config/webpack.js.
NODE_ENV |
webpack mode | description |
|---|---|---|
development |
webpack.watch() |
Rebuilds on file changes during runtime |
staging or production |
webpack.run() |
Build bundle once on load. |
This hook uses standard Webpack Configuration.
Below is an example of using webpack to compile a React.js application located in assets/js/.
// config/webpack.js
var webpack = require('webpack');
var path = require('path');
// compile js assets into a single bundle file
module.exports.webpack = {
options: {
devtool: 'eval',
entry: [
'./assets/js',
],
output: {
path: path.resolve(__dirname, '../.tmp/public/js'),
filename: 'bundle.js'
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
],
module: {
loaders: [
// requires "npm install --save-dev babel-loader"
{ test: /\.js$/, loader: 'babel-loader' },
{ test: /\.css$/, loaders: ['style-loader', 'css-loader'] }
]
}
},
// Suppress errors/warnings from the sails-webpack hook.
// Since webpack displays its own errors, these settings are helpful to
// reduce console clutter.
suppressErrors: true,
suppressWarnings: true,
// docs: https://webpack.github.io/docs/node.js-api.html#compiler
watchOptions: {
aggregateTimeout: 300
}
};<!-- views/layout.ejs -->
<script src="/js/bundle.js"></script>$ sails liftMIT
