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

       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.

process
       See "process" in Mojolicious::Plugin::AssetPack::Pipe.

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

       Mojolicious::Plugin::AssetPack.

perl v5.40.0                                       2024-12-07              Mojolicious::P...ck::Pipe::Vuejs(3pm)

       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!\"}}
         "}))();