Javascript 需要(并将值传递给)从my page/html浏览模块
我正在将我的requirejs+play框架资产管道转换为gulp/browserify。到目前为止,这是一次伟大的旅程。然而,我遇到了一个主要障碍 当我使用requireJs时,我可以在我的页面上执行以下操作:Javascript 需要(并将值传递给)从my page/html浏览模块,javascript,requirejs,gulp,browserify,Javascript,Requirejs,Gulp,Browserify,我正在将我的requirejs+play框架资产管道转换为gulp/browserify。到目前为止,这是一次伟大的旅程。然而,我遇到了一个主要障碍 当我使用requireJs时,我可以在我的页面上执行以下操作: var pageSpecificConstant = @configJsonObj; //something my server gives me. require(['jquery', 'unsubscribe'], function($, unsubscribe) { $
var pageSpecificConstant = @configJsonObj; //something my server gives me.
require(['jquery', 'unsubscribe'], function($, unsubscribe) {
$(function () {
unsubscribe.init(pageSpecificConstant);
});
});
基本上,我需要将一些页面级数据传递给至少一些模块
现在使用gulp/browserify和factor插件,我生成了两个包:
<script src="js/bundles/unsubscribe.js"></script>
<script src="js/bundles/common.js"></script>
不幸的是,这在browserify中是不可能的
我想知道我的选择是什么。我读过关于browserify的一个独立选项,但我不完全清楚如何使用它,因为我正在生成多个bundle
这是我大口大口喝咖啡的步骤,它仍处于原型阶段
browserify: function() {
var bundler = browserify(['./public/javascripts/unsubscribe.js', './public/javascripts/homepage.js'], {
debug: !production,
transform: [stringify({
extensions: ['.html', '.mustache', '.handlebars'],
minify: true,
minifier: {
extensions: ['.html', '.mustache', '.handlebars']
}
}),
[browserifyCss, {
'autoInject': true,
'rootDir': './public/target/css'
}]
],
globals: true,
cache: {}
})
var build = argv._.length ? argv._[0] === 'build' : false;
if (watch) {
bundler = watchify(bundler);
}
var rebundle = function() {
return bundler
.plugin(factorBundle, {
//factor-bundle plugin
// File output order must match entry order
o: ['./public/target/javascripts/bundles/unsubscribe.js', './public/target/javascripts/bundles/homepage.js']
})
.bundle()
.on('error', handleError('Browserify'))
.pipe(source('common.js'))
.pipe(gulpif(production, buffer()))
.pipe(gulpif(production, uglify()))
.pipe(gulpif(production, gzip()))
.pipe(gulp.dest('./public/target/javascripts/bundles'));
};
bundler.on('update', rebundle);
return rebundle();
}
我只需要一些方法将值从页面传递到我的browserify模块。任何帮助都将不胜感激
感谢提供了一个快速解决方案,我在入口点导出了该应用程序,因此如果您的/path/to/bootstrap.js如下所示:
var app = require("./app.js"),
config = requrie("./config.js");
app.init(config)
.run();
然后将入口点更改为包含以下内容的文件/path/to/export.js:
var app = require("./app.js");
window.app = app;
然后在我使用PHP的页面中:
app.init(
<?php echo json_encode($config); ?>
)
.run();
我不太确定你想要什么。为什么不在可以使用页面数据调用的模块上公开init方法呢?您可能会使用[externalize]https://github.com/epeli/browserify-externalize 问题是我支持一个旧的平台,它通过模块的init方法将许多特定于页面的设置/变量传递给JS。您可能会争辩说我可以发出get请求并获取这些,但这将涉及对某些页面的大量重构。我不想惰性地加载模块,因为从技术上讲,由于我在页面上加载的捆绑包,模块已经可用。我只是不知道如何要求它们。如果模块上有init方法,并且您正在将pageSpecificVariable写入窗口,那么您应该能够执行module.initglobal.pageSpecificVariable,并且它将以相同的方式工作。谢谢您的建议。这绝对是一种方法。我仍然希望我可以从我的浏览器等模块做一些测试。我发现了这个-我会让你知道它是否适合我们。
app.init(
<?php echo json_encode($config); ?>
)
.run();