Vue-Vanilla is a vue-loader full featured library that allows single file components without additional tools. Features Lazy (or eager) loading

Functional components

Require dependent JS or CSS

Custom template/script/css transformers that allow CSS vars

Using Vue Vanilla is simple. There is no requirejs, amd, commonjs requirement. No babbel, webpack, webpack2, browserify, or nodejs. It's just vanilla JavaScript. Download the library, load it via a script tag, and get going!

This library currently is not served on any CDN's (see https://github.com/cdnjs/cdnjs/blob/master/CONTRIBUTING.md#b-request-a-new-library) But that won't stop you from downloading the library and dropping it into your project! import-vue-component.js import-vue-component.min.js import-vue-component.min.js.map

It is required to have a browser or polyfill for the Promises and fetch apis. As far as browser compatibilities go, ie9+ requires the fetch and promise polyfill:

By default, all resources are split up into two categories: lib and vue. Vue resources come from $basePath/vue/component-name.vue.html. Lib resources come from $basePath/vendor/library-path. However, you can specify other locations for your component if you want to be more organized or if your component has a conflicting js object name:

Designing components is intended to be easy. All that's needed is a file with a script and a template. The script must define a window-level javascript name of the component.

Sometimes, when you load a component, you need to be sure that you have all of the required libraries and css scripts loaded. By wrapping your component definition in an object with a require and then property, your component will try to load the scripts and styles first. Styles will not be loaded by the importer twice. If the key of the script, 'jQuery' in this case, is present, then it will not attempt to load it. If you are worried about version conflicts, then this library's opinion is that you are already dealing with too much dependency sprawl and should reduce your JavaScript usage.

Lightweight functional components can be implemented like: component here