table of contents
Mojolicious::Plugin::AssetPack::Pipe::Vuejs(3pm) | User Contributed Perl Documentation | Mojolicious::Plugin::AssetPack::Pipe::Vuejs(3pm) |
NAME¶
Mojolicious::Plugin::AssetPack::Pipe::Vuejs - Process .vue filesDESCRIPTION¶
This modules is EXPERIMENTAL and based on homebrewed regexes instead of running the code through an external nodejs binary!This pipe could get pulled completely from the Mojolicious::Plugin::AssetPack distribution if the problem is too hard to solve.
SYNOPSIS¶
Currently only "script" and "template" is supported. "style" is not yet supported.Here is an example ".vue" file:
<template> <h1 :id="id">Example</h1> <button @click="toggle" :disabled="loading">{{loading ? "loading" : "click me!"}}</button> </template> <script> var initial = false; module.exports = { data: function() { return {id: id, loading: initial} }, methods: { toggle: function() { this.loading = !this.loading; } } }; </script>
The vuejs file above produces this output:
(function(){ var initial = false; Vue.component("example", { data: function() { return {id: id, loading: initial} }, methods: { toggle: function() { this.loading = !this.loading; } }, template: " Example {{loading ? \"loading\" : \"click me!\"}} "}))();
METHODS¶
process¶
See "process" in Mojolicious::Plugin::AssetPack::Pipe.SEE ALSO¶
Mojolicious::Plugin::AssetPack.2018-09-17 | perl v5.26.2 |