![](/img/trans.png)
[英]Workflow/tools for frontend javascript development/test and production?
[英]Frontend Development Workflow
我很好奇是否有其他人使用类似的方法,或者如果有人有想法或建议来帮助改善工作流程。 据我所知,这是一种有点原创的方法。
基本上,我正在使用NodeJS来开发我的客户端代码。 我使用Grunt + watch自动连接并将我的所有项目源缩小为一个.min文件,该文件被写入public / js文件夹。 但是,为了测试我使用Jasmine-node,因此我需要一个索引文件(仅用于此目的),它需要所有项目源文件。 但是,因为我想在Node和浏览器中运行相同的代码,所以我将所有内容添加到全局项目命名空间,例如:
myApp.framework.someClass
在myapp.js文件中,然后我导出到节点(如果模块+导出存在)。 这允许我的所有对象都暴露给节点,而不必将module.exports东西添加到每个源文件,相反,我可以简单地做:
(function() { myApp.framework.someClass = function() {...} })();
在每个文件中,甚至简单地:
myApp.framework.someClass = function() {...}
这对于客户端来说效果非常好,因为一切都已经存在于内存中,但是缺点是在Node中,有时尝试访问myApp命名空间中的另一个类会失败,因为我没有使用像RequireJS这样的东西来管理依赖项。
我的想法可能是像在标准节点应用程序中那样添加文件的需求,但是在构建过程中,有任何节点特定的东西,被剥离。
请思考/评论!
我已经看到这样的技巧被用于使JS代码在Node和浏览器环境中使用。 这是来自异步库:
// Node.js
if (typeof module !== 'undefined' && module.exports) {
module.exports = async;
}
// AMD / RequireJS
else if (typeof define !== 'undefined' && define.amd) {
define([], function () {
return async;
});
}
// included directly via <script> tag
else {
root.async = async;
}
https://github.com/caolan/async/blob/master/lib/async.js
希望有所帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.