Я хочу интегрировать React.js + браузер в моем Sails.js-приложении.
Для этого я использую gunt-плагин grunt-react.
Я создал файл /tasks/config/browserify.js
module.exports = function(grunt) {
grunt.config.set('browserify', {
//dev: {
options: {
transform: [ require('grunt-react').browserify ],
extension: 'jsx'
},
app: {
src: 'assets/jsx/app.jsx',
dest: '.tmp/public/js/app.js'
}
//}
});
grunt.loadNpmTasks('grunt-browserify');
};
Затем я добавил строку в compileAssets.js
и syncAssets.js
:
// compileAssets.js
module.exports = function (grunt) {
grunt.registerTask('compileAssets', [
'clean:dev',
'stylus:dev',
'browserify', // <<< this added
'copy:dev'
]);
};
и
// syncAssets.js
module.exports = function (grunt) {
grunt.registerTask('syncAssets', [
'stylus:dev',
'browserify', // <<< this added
'sync:dev'
]);
};
Затем я изменил строку в copy.js
.
// copy.js
module.exports = function(grunt) {
grunt.config.set('copy', {
dev: {
files: [{
expand: true,
cwd: './assets',
src: ['**/*.!(styl|jsx)'], /// <<< this modified
dest: '.tmp/public'
}]
},
build: {
files: [{
expand: true,
cwd: '.tmp/public',
src: ['**/*'],
dest: 'www'
}]
}
});
grunt.loadNpmTasks('grunt-contrib-copy');
};
И это сработало!
Но я думаю, что я не сделал это совершенно правильно.
Если я раскоментировал строку dev: {
и }
в /tasks/config/browserify.js
следующим образом:
module.exports = function(grunt) {
grunt.config.set('browserify', {
dev: { /// <<< this uncommented
options: {
transform: [ require('grunt-react').browserify ],
extension: 'jsx'
},
app: {
src: 'assets/jsx/app.jsx',
dest: '.tmp/public/js/app.js'
}
} /// <<< this uncommented
});
grunt.loadNpmTasks('grunt-browserify');
};
И если я вношу изменения в compileAssets.js
и syncAssets.js
:
// compileAssets.js
module.exports = function (grunt) {
grunt.registerTask('compileAssets', [
'clean:dev',
'stylus:dev',
'browserify:dev', // <<< this added :dev
'copy:dev'
]);
};
и
// syncAssets.js
module.exports = function (grunt) {
grunt.registerTask('syncAssets', [
'stylus:dev',
'browserify:dev', // <<< this added :dev
'sync:dev'
]);
};
он не работает!
Стоит ли беспокоиться об этом?
И почему он не работает, когда я добавляю browserify: dev
в compileAssets.js
и syncAssets.js
файлы?