Vue.js 2 Design Patterns and Best Practices

Loading modules without Webpack

Although Webpack helps us in more ways than simply loading a module, we can load a JavaScript module at this moment in time natively in the browser. It tends to perform worse than bundling tools (at the time of writing), but this may change over time.

To demonstrate this, let's head over to the terminal and make a simple counter with a project based on the simple template. This template effectively starts a new Vue project without any bundling tools:

# New Vue Projectvue init simple vue-modules# Navigate to Directorycd vue-modules# Create App and Counter filetouch app.jstouch counter.js

We can then edit our index.html to add script files from type="module" this allows us to use the export/import syntax outlined ...