Gulp Plugin which inlines artTemplate file (or css files) directly in JS by '__inline', and compiles them into JS
npm install gulp-component-inline --save-dev
const gulp = require('gulp');
const component = require('gulp-component-inline');
gulp.task('default', () =>
gulp.src('src/*.js')
.pipe(component())
.pipe(gulp.dest('dist'))
);
The plugin can actively recognize which type of file do you want to compile. So it don't need any extra APIs, just use it simply in you task.
__inline('../tmpl/index.tmpl');
__inline('../css/index.css');
__inline('../css/index.scss');
<span class="menu-name">{{menu.title}}</span>
p {
margin: 0;
}
div {
text-align: center;
a {
color: red;
}
}
Finally, index.js will compile to what is bellow:
[function($data,$filename
/*``*/) {
var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,menu=$data.menu,$out='';$out+='<span class="menu-name">';
$out+=$escape(menu.title);
$out+='</span>\n';
return new String($out);
}][0];
__inline('p{margin:0}');
__inline('div{text-align:center}div a{color:red}');
Congratulations! You now have mastered the usage of the plugin.
MIT