Repository files navigation

A plugin to help webpack concat js and inject into html

Webpack is really powerful. However, when I want to concat the static files and inject into html without webpack JSONP code wrapper, it seems impossible to do that without other tool's help.

npm install webpack-concat-plugin --save-dev

for webpack >= 4.0

npm install webpack-concat-plugin@3.0.0 --save-dev

• Concat
• Inject to html(with html-webpack-plugin)

constConcatPlugin=require('webpack-concat-plugin');newConcatPlugin({    ...seeoptions// examplesuglify:false,sourceMap:false,name:'result',outputPath:'path/to/output/',fileName:'[name].[hash:8].js',filesToConcat:['jquery','./src/lib/**','./dep/dep.js',['./some/**','!./some/excludes/**']],attributes:{async:true}});

if true the output file will be uglified

or setuglifyjs options to customize the output

if true, will output sourcemap

it's useful when you want to inject to html-webpack-plugin manully

if set, will be used as the public path of the script tag.

if set to false, will use relativePath.

if set, will be used as the output directory of the file.

if set, will be used as the output fileName

supported path patterns:

• normal path
• npm packages
• glob

how to auto inject to html-webpack-plugin(only if html-webpack-plugin set inject option not to be false)

if set, will be used as the extra attributes of the script tag.

doctype html...    script(src=htmlWebpackPlugin.files.webpackConcat.flexible)...

• add css support
• auto inject to html