Skip to content
This repository has been archived by the owner on Jan 25, 2024. It is now read-only.

Commit

Permalink
- code refactoring.
Browse files Browse the repository at this point in the history
- language processors (httpVueLoader.langProcessor.*) may now return a promise.
- update doc.
  • Loading branch information
FranckFreiburger committed May 15, 2017
1 parent 82203f6 commit f87d73e
Show file tree
Hide file tree
Showing 2 changed files with 380 additions and 297 deletions.
53 changes: 47 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ Load .vue files directly from your html/js. No node.js environment, no build ste
## examples

`my-component.vue`
```html
```vue
<template>
<div class="hello">Hello {{who}}</div>
</template>
Expand Down Expand Up @@ -85,8 +85,7 @@ or, using an array
* `<style scoped>` is supported.
* `module.exports` may be a promise.
* Support of relative urls in `<template>` and `<style>` sections.
* Support custom scripting language `<script lang="coffee">` (see VueLoader.langProcessor).
* `http-vue-loader` only supports text/x-template for `<template>` and text/css for `<style>`.
* Support custom CSS, HTML and scripting languages, eg. `<script lang="coffee">` (see VueLoader.langProcessor).
## Browser Support
Expand Down Expand Up @@ -139,9 +138,9 @@ httpVueLoader.httpRequest = function(url) {
This is an object that contains language processors related to the `lang` attribute of the `<script>` section.
The language is a simple function that accepts a script source as argument and returns a javascript script source.
Example:
Example - CoffeeScript:
```
```JavaScript
<script src="http://coffeescript.org/v1/browser-compiler/coffee-script.js"></script>
<script src="httpVueLoader.js"></script>
Expand All @@ -157,7 +156,7 @@ httpVueLoader.langProcessor.coffee = function(scriptText) {
Then, in you `.vue` file:
```
```CoffeeScript
...
<script lang="coffee">
Expand All @@ -174,6 +173,48 @@ module.exports =
```
Example - Stylus:
```JavaScript
<script src="//stylus-lang.com/try/stylus.min.js"></script>
<script src="httpVueLoader.js"></script>
<script>
httpVueLoader.langProcessor.stylus = function(stylusText) {
return new Promise(function(resolve, reject) {
stylus.render(stylusText, {}, function(err, css) {
if (err) reject(err);
resolve(css);
});
})
}
</script>
```
```stylus
...
<style lang="stylus">
border-radius()
-webkit-border-radius: arguments
-moz-border-radius: arguments
border-radius: arguments
form input
padding: 5px
border: 1px solid
border-radius: 5px
</style>
...
```
## How it works
1. http request the vue file
Expand Down

0 comments on commit f87d73e

Please sign in to comment.