[英]How can i get jade template to compile automatically in visual studio on save operation?
Could anyone post some basic steps on how to get *.html files to compile to *.jade files on file change / save operation in Visual Studio? 谁能在Visual Studio中通过文件更改/保存操作发布关于如何将* .html文件编译为* .jade文件的一些基本步骤?
I have installed nodetools, web essentials. 我已经安装了nodetools,Web基础知识。 Syntax highlighting seems to work, but creating a .jade file does nothing.
语法高亮显示似乎起作用,但是创建.jade文件没有任何作用。 I think there is a missing step somewhere.
我认为某处缺少一个步骤。
Do I have to use something like grunt-contrib-jade with a task? 我必须在任务中使用grunt-contrib-jade之类的东西吗?
Visual Studio 2015: After fiddling around a lot the answer i have is as follows: Visual Studio 2015:经过反复摆弄后,我得到的答案如下:
Package.json : as follows Package.json:如下
{
"name": "myapp",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.5",
"grunt-contrib-uglify": "~0.5.0",
"grunt-contrib-jade": "0.15.0",
"grunt-contrib-watch": "0.6.1"
}
}
7) Create the following grunt.js file 7)创建以下grunt.js文件
module.exports = function (grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
jade: {
compile: {
options: {
data: {
debug: true,
timestamp: "<%= new Date().getTime() %>"
}
},
files: [{
expand: true,
src: '**/*.jade',
ext : '.html'
}]
}
},
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
build: {
src: 'Scripts/bootstrap.js',
dest: 'Scripts/build/bootstrap.min.js'
}
},
watch: {
jade: {
files: '**/*.jade',
tasks: ['jade:watch'],
options: {
spawn: false
}
}
}
});
grunt.event.on('watch', function (action, filepath) {
if (filepath.indexOf('.jade') === -1) return;
var file = {};
var destfile = filepath.replace('.jade', '.html');
file[destfile] = filepath
grunt.config('jade.watch.files', file);
});
grunt.loadNpmTasks('grunt-contrib-watch');
// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-jade');
// Default task(s).
grunt.registerTask('default', ['uglify']);
};
Open Task Explorer and then make sure you add/bind the task "watch" to project open. 打开任务资源管理器,然后确保添加/绑定任务“监视”以打开项目。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.