Sometimes in the world of web development you have to work around some funny deployment issues and do things a bit manually.
An issue I recently encountered was trying to copy a single file into the build folder when using webpack to build and run the non-local environment.
After a quick Google (every developers first port of call) I found CopyWebpackPlugin which allows you to copy a single file into the build directory rather than bundling it.
new CopyWebpackPlugin([
{ from: "kendo" },
{ from: "Material", to: "Material" }
]),
Using this code snippet I was able to copy everything from the kendo folder into the build directory. As well as the Material folder into a sub folder, also called Material.
However this was not the end of the process, as the kendo files needed to be included in the template.html as scripts and stylesheets. The tags could not be added manually as the files sat in different places for the build and local development running of the app.
Luckily another plugin, HtmlWebpackIncludeAssetsPlugin, came to the rescue.
This allowed for the script and stylesheets to inserted into the template.html on both build and the local development for the relevant file locations for both ways.
new HtmlWebpackIncludeAssetsPlugin({
assets: ["kendo.js", "kendo.css"],
append: false
}),
So if you ever need to specifically include some files in the build without it being bundled with the rest of your code these two plugins are a great way to do it.