Skip to content

Commit 02dc4f0

Browse files
updated: use the riot-parser and setup the env
1 parent 99eed54 commit 02dc4f0

18 files changed

+2976
-323
lines changed

README.md

-85
Original file line numberDiff line numberDiff line change
@@ -9,94 +9,9 @@
99

1010
WIP come back soon
1111

12-
## Idea
13-
14-
The idea is to generate valid javascript files from riot tag files
15-
For example `my-tag.tag`:
16-
```html
17-
<template>
18-
<p onclick={ updateMessage('goodbye') }>
19-
{ message }
20-
</p>
21-
22-
{#if error}
23-
<div>
24-
<p>{ error }</p>
25-
</div>
26-
{#else}
27-
no errors
28-
{/if}
29-
30-
<ul>
31-
{#each item in items}
32-
<li>{ item.value }</li>
33-
{/each}
34-
</ul>
35-
</template>
36-
37-
<script>
38-
export default {
39-
error: 'this is an error',
40-
message: 'nice message',
41-
items: [{ value: 'one'}, { value: 'two'}]
42-
updateMessage(message) {
43-
this.update({ message, error: false })
44-
}
45-
}
46-
</script>
47-
48-
<style>
49-
:root {
50-
background: red;
51-
}
52-
</style>
53-
```
54-
55-
Will become:
56-
57-
```js
58-
riot.define('my-tag', {
59-
error: 'this is an error',
60-
message: 'nice message',
61-
items: [{ value: 'one'}, { value: 'two'}],
62-
updateMessage(message) {
63-
this.update({ message, error: false })
64-
}
65-
get css() {
66-
return `
67-
:root {
68-
background: red;
69-
}
70-
`
71-
},
72-
render(h) {
73-
return h`
74-
<p onclick="${ this.updateMessage.bind(this, 'goodbye') }">
75-
${ this.message }
76-
</p>${
77-
this.error ? `
78-
<div>
79-
<p>${ this.error }</p>
80-
</div>
81-
` : `no errors`
82-
}<ul>${
83-
Array.from(this.items).map((item) => {
84-
return (`
85-
<li>${ item.value }</li>
86-
`)
87-
})
88-
}</ul>
89-
`;
90-
}
91-
})
92-
```
93-
94-
Check for example [this demo](https://jsfiddle.net/gianlucaguarini/ed31q3qk/) to see how it's going to work
95-
9612
## New specs
9713

9814
- All the code in the `<script>` tag will be left untouched without adding any extra riot magic
99-
- The tag templates must be wrapped into a `<template>` tag
10015
- The relation `riot tag => file.tag` will be 1 to 1 so it will be not possible to define multiple tags in the same file
10116
- It will be not possible to define multiple `<script><template><style>` tags in the same file
10217

0 commit comments

Comments
 (0)