#web-component

Vue JS CLI – How to Change Build Mode

If you use Vue CLI, a default build mode does not include compiler, which mean your component’s template has to be rendered (in main.js). To pre-compile component’s template, change Vue build mode to full build (include compiler), see here.

Follow this steps to change build:

Add “vue.config.js” to root folder.

In the config file, add following configuration:

module.exports = { runtimeCompiler:…

Building reusable frontend components is difficult. Bringing together all your html templates, JavaScript & styling relies on your diligence with best practices for creating maintainable, reusable and well documented code.

Recent frameworks such as Angular, React, Ember etc. aim to help but don't pay much attention to styling or sharing modular, reusable components, they give you opinionated options of how to build integrated applications.

Web Components have come along to deal with this specific problem and has had a big kick up the arse with Polymer to provide cross browser support.

MoneyIO lends itself to have reusable components that represent transaction entries and charts with different attributes that need to update automatically to reflect calculated values, as happens with spreadsheets (reactive programming).

Soo, we've jumped on this new tech bandwagon and offered our first component open source on Bower https://github.com/moneyio/payment-item. Now you're unlikely to get as much benefit from using this little component as us but follow our repos and see what's happening behind the scenes.