Support for custom .vue blocks #31
Conversation
README.md
Outdated
| @@ -42,6 +42,25 @@ hooks('ts').push(function({content}){ | |||
| /* transpile your script code here */ | |||
| }); | |||
| ``` | |||
|
|
|||
| For custom blocks in `.vue` files, add other require hooks for the name of the blocks, | |||
There was a problem hiding this comment.
Can you give this section its own header? I think it's a big-enough (and optional) feature that it deserves its own section
README.md
Outdated
| @@ -62,9 +81,9 @@ plugin.configure({ transpileTemplates: false }); | |||
| ``` | |||
|
|
|||
| ### transpileTemplates | |||
| `true` | |||
There was a problem hiding this comment.
Can you re-add the whitespace from these two lines as they're needed for line breakage
There was a problem hiding this comment.
Grr, my editor removed the end-of-line whitespace automatically. Never seen end-of-line whitespace actually matter before.
README.md
Outdated
|
|
||
| You can access the exported options object using (as vue-template-compiler does itself): | ||
| ```javascript | ||
| ((module.exports.default || module.exports).options || module.exports.default || module.exports) |
There was a problem hiding this comment.
I'm not overly keen on having this example in the docs as it's not pretty. Instead could you replace this whole paragraph with an explanation that the returned content will be appended to the file
README.md
Outdated
| hooks('vue').plugin('vue'); | ||
| hooks('vue-block-json').push(({ content }) => { | ||
| // Strings returned here will be appended to the compiled .vue file. This should return JavaScript, in a string. | ||
| return ''; |
There was a problem hiding this comment.
Can you have this example show something more realistic than an empty string?
Something like export const jsonBlock = ${content}
Another option which might be good would be to export this string as a constant from the package for people to use. So your hook would look something like ${COMPONENT_EXPORT}.name = ${content}
There was a problem hiding this comment.
That's a great idea!
60edd24 to
fbeb05b
Compare
|
@jackmellis cleaned up the readme per your recommendations. Let me know if I went overboard for the example - it's a real-world use case, I've found that adding a mixin is the safest way to add functionality to a component.
|
I've added support for custom
<blocks>in.vuefiles.It piggybacks on top of require-extension-hooks too, and prefixes the block names with
vue-block-. So for example if you add a hook forvue-block-json, then you can parse a<json>block and do whatever you like with it.The return value of the hook is appended to the compiled
.vuefile, so you can run anything you like in there.What do you think?