based off inject-html-webpack-plugin. Takes js/css files and using the twig view.register syntax, injects the files.
npm install inject-twig-webpack-plugin --save--devadd 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><!-- start:js -->
{% do view.registerJsFile(siteUrl ~ "/assets/js/vue/dist/index.c38144da9d3ebd917778.js") %}
<!-- end:js -->