Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/SeregPie/VueInBrowserLoader

Loads a .vue file from the given URL and compiles it to a component directly in the browser.
https://github.com/SeregPie/VueInBrowserLoader

async browser client get http load local url vue

Last synced: about 1 month ago
JSON representation

Loads a .vue file from the given URL and compiles it to a component directly in the browser.

Lists

README 

        
# VueInBrowserLoader



Inspired by Franck Freiburger's [http-vue-loader](https://github.com/FranckFreiburger/http-vue-loader).



---



`VueInBrowserLoader(url)`



Loads a `.vue` file from the given URL and compiles it to a component directly in the browser. Already loaded components are cached.



## dependencies



- [Vue](https://github.com/vuejs/vue)



## setup



### npm



```shell

npm install vueinbrowserloader

```



### ES module



```javascript

import VueInBrowserLoader from 'vueinbrowserloader';

```



### browser



```html



```



## usage



```javascript

new Vue({

  components: {

    'MyButton': VueInBrowserLoader('/app/components/Button.vue'),



    'MyDialog': VueInBrowserLoader('/app/components/Dialog'),

     // resolves to '/app/components/Dialog/index.vue'

  },

  /*...*/

});

```



---



Use relative URLs.



```html



module.exports = {

  components: {

    'MyTitleBar': VueInBrowserLoader('./TitleBar.vue'),

    // resolves to '/app/components/Dialog/TitleBar.vue'



    'MyButton': VueInBrowserLoader('../Button.vue'),

    // resolves to '/app/components/Button.vue'

  },

  /*...*/

});



```



---



Separate files.



```html



```



## todo



- scoped style

- pre-processors

- post-processors