So, in Sage 9 we’re able to add custom styles/scripts by adding them to config.json. We’re also able to add third-party assets by importing them into either the scss or js main files after a yarn add.
Is there a reason we only import when it is a third-party package/node_module and add other custom files in the config.json?
If we create a custom script file like checkout.js, can we import that into the main.js and not add it into config.json?
What is the reasoning for the difference in adding assets either way?
I don’t know if I’m qualified to answer, but I’ll have a go! My understanding is that it’s quite flexible and the choice depends on your needs… For example, I would add an entry to config.json if I wanted to have a separate file generated (eg. a large library that is only needed on certain pages and would be inefficient in the main JS bundle).
I’m still figuring out the JS ecosystem but I think third-party packages tend to be packaged differently to simple custom scripts we are used to making. The key seems to be the export statement in the JS files - that’s what allows them to be imported by other scripts.
So if your custom checkout.js script does an export, you could import it elsewhere instead of having to add it to config.json (which simply seems to get Webpack to concatenate the files and therefore is suitable for older style JS files).