Skip to content

Latest commit

 

History

History
77 lines (63 loc) · 1.46 KB

README.md

File metadata and controls

77 lines (63 loc) · 1.46 KB
Raw

inject-twig-webpack-plugin

NPM

based off inject-html-webpack-plugin. Takes js/css files and using the twig view.register syntax, injects the files.

Install

npm install inject-twig-webpack-plugin --save--dev

Usage

add plugin in your webpack.config.js

var InjectTwigPlugin = require('inject-twig-webpack-plugin');

module.exports = {
    entry:{
        index:"./index.js"
    },
    module:{
        loaders:[
            ...
        ]
    },
    output:{
        path:'./dist',
        filename:'[name].min.js'
    },
    plugins:[
        new InjectTwigPlugin({
            transducer: function (filename) {
                return "/assets/js/vue/dist/"+filename;
            },
            filename: '../../../../templates/_layout/_footer.html',
            chunks:['index']
        })
    ]
}

then add below placeholders into html file

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <!-- start:css -->
  <!-- end:css -->
</head>
<body>
  <!-- start:js -->
  <!-- end:js -->
</body>
</html>

Output

<!-- start:js --> 
{% do view.registerJsFile(siteUrl ~ "/assets/js/vue/dist/index.c38144da9d3ebd917778.js") %}
<!-- end:js -->

License

MIT License