javascript - Webpack 2 - Supress chunk files -
as putting output on load balancer (not using sticky), need place output of these files without chunks (neither hashes).
these main 2 files webpack configuration.
webpack.common.js
const path = require('path'); const webpack = require('webpack'); const htmlwebpackplugin = require('html-webpack-plugin'); const extracttextplugin = require('extract-text-webpack-plugin'); const helpers = require('./helpers'); const static_translation_map = require('../translationmap.json'); module.exports = { entry: { app: ['./src/public/main.ts'], vendor: './src/public/vendor.ts', polyfills: './src/public/polyfills.ts' }, output: { path: helpers.root('dist/public') }, module: { rules: [ { test: /\.ts$/, loaders: ['awesome-typescript-loader', 'angular2-template-loader', 'angular2-router-loader'] }, { test: /\.html$/, loader: 'html-loader?-minimize' }, { test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: 'file-loader?name=assets/[name].[ext]' }, { test: /\.styl$/, include: helpers.root('src', 'public', 'app'), use: [ 'raw-loader', 'stylus-loader' ] }, { test: /\.styl$/, include: helpers.root('src', 'public'), exclude: helpers.root('src', 'public', 'app'), use: extracttextplugin.extract({ fallback: 'style-loader', use: [ 'css-loader', 'stylus-loader' ] }) }, { test: /\.css$/, include: helpers.root('src', 'public', 'assets', 'css'), loader: 'raw-loader' }, { test: /\.xlf$/, loader: 'raw-loader' } ] }, resolve: { extensions: ['.webpack.js', '.web.js', '.ts', '.js'], alias: {} }, plugins: [ new webpack.optimize.commonschunkplugin({ name: ['app', 'vendor', 'polyfills'] }), new htmlwebpackplugin({ template: 'src/public/index.html' }), new webpack.defineplugin({ 'process.env': { 'locale_list': json.stringify(object.keys(static_translation_map)) } }) ] };
webpack.prod.js
const webpack = require('webpack'); const webpackmerge = require('webpack-merge'); const extracttextplugin = require('extract-text-webpack-plugin'); const commonconfig = require('./webpack.common.js'); const helpers = require('./helpers'); const prodenv = 'production'; module.exports = webpackmerge(commonconfig, { devtool: 'source-map', output: { filename: '[name].js', chunkfilename: '[name].js' }, plugins: [ new webpack.noemitonerrorsplugin(), new webpack.optimize.uglifyjsplugin({ mangle: { keep_fnames: true } }), new webpack.loaderoptionsplugin({ htmlloader: { minimize: false } }), new extracttextplugin('[name].css'), new webpack.defineplugin({ 'process.env': { 'env': json.stringify(prodenv) } }) ] });
but surprise, noticed webpack producing files. can see ones numbers? (from 0 19). i'm not sure they're coming from, , every content of starts webpackjsonp
.
is there way disable chunk feature , produce 3 files entry
?
what happening?
but surprise, noticed webpack producing files. can see ones numbers? (from 0 19)
output.chunkfilename
this option determines name of non-entry
chunk files. default [id].js
used or value inferred output.filename (name replaced id):
non-entry chunks (external)
./dist/[0].js ./dist/[1].js ./dist/[2].js ./dist/[3].js ...
entry-chunks webpack.config.entry
./dist/app.js ./dist/vendor.js ...
how fix it?
currently commonchunkplugin receives modules imported entry chunks.
workarounds / hacks
this concept may used obtain implicit common vendor chunks:
new webpack.optimize.commonschunkplugin({ name: "vendor", minchunks: function (module) { // assumes vendor imports exist in node_modules directory return module.context && module.context.indexof("node_modules") !== -1; } })
passing minchunks property function
Comments
Post a Comment