webpack-concat-plugin
    DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/webpack-concat-plugin package

    3.0.0 • Public • Published

    webpack-concat-plugin

    Build Status npm package npm downloads

    A plugin to help webpack concat js and inject into html

    Why

    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.

    Install

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

    for webpack >= 4.0

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

    Features

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

    Usage

    const ConcatPlugin = require('webpack-concat-plugin');
     
    new ConcatPlugin({
        ...see options
        // examples
        uglify: 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
        }
    });
     

    Options

    uglify [boolean | object] default: false

    if true the output file will be uglified

    or set uglifyjs options to customize the output

    sourceMap [boolean] default: false

    if true, will output sourcemap

    name [string] default: "result"

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

    publicPath [string|boolean] default: webpack's publicPath

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

    if set to false, will use relativePath.

    outputPath [string]

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

    fileName [string] default: [name].js

    if set, will be used as the output fileName

    filesToConcat [array] required

    supported path patterns:

    • normal path
    • npm packages
    • glob

    injectType ["prepend"|"append"|"none"] default: "prepend"

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

    attributes [object]

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

    Examples

    Inject to html by hand

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

    TODO

    • add css support
    • auto inject to html

    Keywords

    none

    Install

    npm i webpack-concat-plugin

    DownloadsWeekly Downloads

    21,683

    Version

    3.0.0

    License

    ISC

    Unpacked Size

    39.8 kB

    Total Files

    7

    Last publish

    Collaborators

    • huangxueliang