File Coverage

blib/lib/Mojolicious/Plugin/AssetPack/Pipe/Vuejs.pm
Criterion Covered Total %
statement 24 24 100.0
branch 5 10 50.0
condition n/a
subroutine 3 3 100.0
pod 1 1 100.0
total 33 38 86.8


line stmt bran cond sub pod time code
1             package Mojolicious::Plugin::AssetPack::Pipe::Vuejs;
2 1     1   47 use Mojo::Base 'Mojolicious::Plugin::AssetPack::Pipe';
  1         5  
  1         10  
3              
4             sub process {
5 1     1 1 3 my ($self, $assets) = @_;
6 1         7 my $store = $self->assetpack->store;
7              
8             return $assets->each(sub {
9 1     1   24 my ($asset, $index) = @_;
10 1 50       6 return unless $asset->format eq 'vue';
11              
12 1         6 my $vue = sprintf 'Vue.component("%s", {', $asset->name;
13 1         4 my ($script, $template);
14              
15 1 50       5 if ($asset->content =~ m!]*>(.+)!s) {
16 1         72 $script = $1;
17 1 50       37 $vue = "$1$vue" if $script =~ s!^(.*)\s?module\.exports\s*=\s*\{!!s;
18 1         89 $script =~ s!\s*\}\s*;?\s*$!!s;
19 1         6 $vue .= $script;
20             }
21              
22 1 50       6 if ($asset->content =~ m!]*>(.+)!s) {
23 1         85 $template = $1;
24 1         8 $template =~ s!"!\\"!g; # escape all double quotes
25 1         5 $template =~ s!^\s*!!s;
26 1         9 $template =~ s!\r?\n!\\n!g;
27 1 50       7 $vue .= qq',\n' if $script;
28 1         4 $vue .= qq' template: "$template"';
29             }
30              
31 1         7 $vue = Mojo::Util::encode('UTF-8', "(function(){$vue})})();");
32 1         70 $asset->content($vue)->format('js');
33 1         17 });
34             }
35              
36             1;
37              
38             =encoding utf8
39              
40             =head1 NAME
41              
42             Mojolicious::Plugin::AssetPack::Pipe::Vuejs - Process .vue files
43              
44             =head1 DESCRIPTION
45              
46             This modules is EXPERIMENTAL and based on homebrewed regexes instead of running
47             the code through an external nodejs binary!
48              
49             This pipe could get pulled completely from the
50             L distribution if the problem is too hard to
51             solve.
52              
53             =head1 SYNOPSIS
54              
55             Currently only C
78              
79             The vuejs file above produces this output:
80              
81             (function(){
82             var initial = false;
83             Vue.component("example", {
84             data: function() {
85             return {id: id, loading: initial}
86             },
87             methods: {
88             toggle: function() {
89             this.loading = !this.loading;
90             }
91             },
92             template: "
93             Example
94             {{loading ? \"loading\" : \"click me!\"}}
95             "}))();
96              
97             =head1 METHODS
98              
99             =head2 process
100              
101             See L.
102              
103             =head1 SEE ALSO
104              
105             L.
106              
107             =cut