Nuxt/lib/webpack/client.config.js

133 lines
4.2 KiB
JavaScript
Raw Normal View History

2017-04-17 13:27:32 +00:00
import { each, defaults } from 'lodash'
2017-01-11 19:14:59 +00:00
import webpack from 'webpack'
import VueSSRClientPlugin from 'vue-server-renderer/client-plugin'
import HTMLPlugin from 'html-webpack-plugin'
import FriendlyErrorsWebpackPlugin from 'friendly-errors-webpack-plugin'
2017-02-08 13:09:59 +00:00
import ProgressBarPlugin from 'progress-bar-webpack-plugin'
2017-01-23 16:55:39 +00:00
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
2017-03-12 00:02:28 +00:00
import OfflinePlugin from 'offline-plugin'
2017-01-11 19:14:59 +00:00
import base from './base.config.js'
import { resolve } from 'path'
2016-11-07 01:34:58 +00:00
/*
|--------------------------------------------------------------------------
| Webpack Client Config
|
| Generate public/dist/client-vendor-bundle.js
| Generate public/dist/client-bundle.js
|
| In production, will generate public/dist/style.css
|--------------------------------------------------------------------------
*/
2017-06-11 14:57:39 +00:00
export default function webpackClientConfig () {
2017-01-09 14:10:22 +00:00
let config = base.call(this, { isClient: true })
2016-11-07 01:34:58 +00:00
// Entry
2017-06-11 14:17:36 +00:00
config.entry.app = resolve(this.options.buildDir, 'client.js')
// Add vendors
if (this.options.store) {
config.entry.vendor.push('vuex')
}
config.entry.vendor = config.entry.vendor.concat(this.options.build.vendor)
// Output
2017-06-11 14:17:36 +00:00
config.output.path = resolve(this.options.buildDir, 'dist')
config.output.filename = this.options.build.filenames.app
2016-11-25 14:37:06 +00:00
// env object defined in nuxt.config.js
let env = {}
2017-01-11 19:14:59 +00:00
each(this.options.env, (value, key) => {
2016-11-25 14:37:06 +00:00
env['process.env.' + key] = (typeof value === 'string' ? JSON.stringify(value) : value)
})
// Webpack plugins
config.plugins = (config.plugins || []).concat([
// Strip comments in Vue code
2016-11-25 14:37:06 +00:00
new webpack.DefinePlugin(Object.assign(env, {
2017-06-11 14:17:36 +00:00
'process.env.NODE_ENV': JSON.stringify(env.NODE_ENV || (this.options.dev ? 'development' : 'production')),
2016-11-24 00:46:20 +00:00
'process.BROWSER_BUILD': true,
2017-02-28 12:10:58 +00:00
'process.SERVER_BUILD': false,
'process.browser': true,
'process.server': true
2016-11-25 14:37:06 +00:00
})),
// Extract vendor chunks for better caching
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filename: this.options.build.filenames.vendor,
minChunks (module) {
// A module is extracted into the vendor chunk when...
return (
// If it's inside node_modules
/node_modules/.test(module.context) &&
// Do not externalize if the request is a CSS file
2017-05-05 14:48:12 +00:00
!/\.(css|less|scss|sass|styl|stylus)$/.test(module.request)
)
}
}),
// Extract webpack runtime & manifest
2017-03-25 23:52:39 +00:00
new webpack.optimize.CommonsChunkPlugin({
name: 'manifest',
minChunks: Infinity,
2017-03-25 23:52:39 +00:00
filename: this.options.build.filenames.manifest
}),
// Generate output HTML
new HTMLPlugin({
template: this.options.appTemplatePath,
inject: false // <- Resources will be injected using vue server renderer
}),
// Generate client manifest json
new VueSSRClientPlugin({
filename: 'client-manifest.json'
2016-11-07 01:34:58 +00:00
})
])
2017-02-08 13:09:59 +00:00
// client bundle progress bar
config.plugins.push(
new ProgressBarPlugin()
)
// Add friendly error plugin
2017-06-11 14:17:36 +00:00
if (this.options.dev) {
config.plugins.push(new FriendlyErrorsWebpackPlugin())
}
// Production client build
2017-06-11 14:17:36 +00:00
if (!this.options.dev) {
config.plugins.push(
// This is needed in webpack 2 for minifying CSS
new webpack.LoaderOptionsPlugin({
minimize: true
}),
// Minify JS
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false
}
})
)
}
2016-12-27 13:54:10 +00:00
// Extend config
if (typeof this.options.build.extend === 'function') {
this.options.build.extend.call(this, config, {
2017-06-11 14:17:36 +00:00
dev: this.options.dev,
2016-12-27 13:54:10 +00:00
isClient: true
})
}
// Offline-plugin integration
2017-06-11 14:17:36 +00:00
if (!this.options.dev && this.options.offline) {
const offlineOpts = typeof this.options.offline === 'object' ? this.options.offline : {}
config.plugins.push(
2017-04-17 13:27:32 +00:00
new OfflinePlugin(defaults(offlineOpts, {}))
)
}
2017-01-23 16:55:39 +00:00
// Webpack Bundle Analyzer
2017-06-11 14:17:36 +00:00
if (!this.options.dev && this.options.build.analyze) {
2017-01-23 16:55:39 +00:00
let options = {}
if (typeof this.options.build.analyze === 'object') {
options = this.options.build.analyze
}
config.plugins.push(
new BundleAnalyzerPlugin(options)
)
}
return config
2016-11-07 01:34:58 +00:00
}