Question

在Famo.us完全改变他们的架构之前，我正在使用Famo.us，RequireJS，EJS模板，Node和其他一些东西开发一些应用程序。

但是现在当我用新的Famo.us'Engine'替换旧的Famo.us架构时，我遇到了错误 - 这告诉我新方法的架构是错误的 - 所以想知道你们是否可以帮助我

背景

服务器是Node.js，Express 4和其他一些东西
客户端将是Famo.us，EJS模板和其他一些东西

目前的做法是'/'路由器调用'ejs'模板。

index.ejs：

  <!DOCTYPE HTML>
    <html>
      <head>
        <title></title>
        <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />
        <meta name="mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <link rel="stylesheet" type="text/css" href="/css/famous.css" />
        <link rel="stylesheet" type="text/css" href="/css/style.css" />
      </head>
      <body>
        <script data-main="/js/webmain.js" src="/js/vendor/requirejs/require.js"></script>
      </body>
    </html>

这适用于旧的Famo.us架构......并且会使用RequireJS调用webmain.js脚本。

webmain.js：

/* globals require */
require.config({
  baseUrl: "js",
  nodeRequire: require,
  paths: {
    "famous": "vendor/famous",
    "famous-flex": "vendor/famous-flex/src",
    json2: "vendor/json2",
    "requirejs": "vendor/requirejs/require",
    "socketcluster": "vendor/socketcluster",
    "ua-parser" : "vendor/ua-parser.min",
    "uuid": "vendor/uuid"
  }
});
require(["platform"]);

'platform.js'脚本将包含以下内容：

define('platform', function(require, exports, module) {
  'use strict';
  var Engine = require("famous/core/Engine");
  var contentContext = Engine.createContext();
  var Widget = require('app/widgets/DefaultWidget');
  var mainView = new Widget();
  var contextSize = [undefined, undefined];

  contentContext.setPerspective(1);

  Engine.nextTick(function() {
    contextSize = contentContext.getSize();
    mainView.setOptions({size: [contextSize[0], contextSize[1]]});
    contentContext.add(mainView);
  });
  contentContext.on('resize', function(e) {
    contextSize = contentContext.getSize();
    if (mainView) mainView.setOptions({size: [contextSize[0]*1, contextSize[1]*1]});
  }.bind(this));


});

但新版本的Famo.us无法使用这种方法，我想问你为什么，或者是否有其他方式没有提到你的想法？

我更新了'vendor / famous'中的Famou.us源代码，以使用github中的'Famo.us Engine'代码。如果我使用新的Famo.us代码替换'platform.js'脚本中的旧Famo.us代码 - 如下所示：

define('platform', function(require, exports, module) {
  'use strict';

var FamousEngine = require('famous/core/FamousEngine');
var DOMElement = require('famous/dom-renderables/DOMElement');

FamousEngine.init();
var scene = FamousEngine.createScene();

var node = scene.addChild();
var domEl = new DOMElement(node, {
    content: 'Hello World',
    properties: {
        fontFamily: 'Arial'
    }
});

});

我收到以下错误：

Uncaught Error: Module name "Clock" has not been loaded yet for context: _. Use require([]) require.js:8
Uncaught Error: Module name "../utilities/CallbackStore" has not been loaded yet for context: _. Use require([]) require.js:8
Uncaught TypeError: Cannot read property 'init' of undefined platform.js:28

我想我试图理解，当RequireJS骨架几乎相同时，为什么它不起作用？为什么Famo.us是未定义的，为什么新的Famo.us架构可以打破这么多 - 以及整合famo.us的'新'方式是什么？

我已经就他们'懒散'的IRC提出了问题，但这似乎不是一种获得答案的方法，也不是一种非常糟糕的“帮助”。

任何帮助都会非常感激，因为我现在真的不能继续前进。

再次感谢。

Answer 1

Famo.us版本0.3.5及更早版本使用AMD RequireJS 。

新版本0.5.0+使用 CommonJS 的node.js风格，并使用Browserify为浏览器构建一个javascript应用程序包。

an Answer in this question中的以下内容总结了一下。更多关于他们在答案中的相同点和不同点。

RequireJS 实施 AMD API (source)。

CommonJS 是一种在exports对象的帮助下定义模块的方法，它定义了模块内容。

使用（NEW）Famo.us引擎与RequireJS和EJS模板

1 个答案: