NAME

       Mojolicious::Plugin::AssetPack::Pipe::Vuejs - Process .vue files

DESCRIPTION

       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.

perl v5.36.0                                2023-Mojolicious::Plugin::AssetPack::Pipe::Vuejs(3pm)