Question

我正在尝试使用require加载protobuf js文件，但我在控制台上遇到异常。

02-21 11:18:06.445 9130-9130/com.p.protoextensiontest I/chromium: [INFO:CONSOLE(5)] "Uncaught Error: Module name "js/proto/data_main_1_pb" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded", source: file:///android_asset/www/js/require.js (5)
"Uncaught Error: Mismatched anonymous define() module: function p(){

这是我的index.js代码

var proto = require('js/proto/aaa_bbb_1_pb');

function onCreate(){
    console.log("in onCreate");
    parseProto();
}
function parseProto(){
    var name = proto.person.personName;
}

这是我的index.html

<head>
    <title> Testing proto extension</title>
    <script src="js/require.js"></script>
    <script src="js/google-protobuf.js"></script>
    <script src="js/index.js"></script>

</head>
<body>
    <button type="button"  onclick="onCreate()"> Create Data</button> <br/> 
</body>

我是javascript和node.js的新手。请提供任何参考。

Answer 1

您在index.js中显示的模块采用CommonJS格式。它没有包装器，并使require调用包含单个字符串参数。

但是，您正在使用RequireJS加载它。 RequireJS是AMD模块加载器，而不是CommonJS模块加载器。您不必完全重写require调用以使用AMD格式（require调用一系列依赖项和回调函数）但您必须至少包装模块＆＃39 ; define调用中的代码，如下所示：

define(function (require) {
  var proto = require('js/proto/aaa_bbb_1_pb');

  function onCreate(){
      console.log("in onCreate");
      parseProto();
  }

  function parseProto(){
      var name = proto.person.personName;
  }
}

请注意，onclick=onCreate()仍然无法正常工作。使用模块的目标之一是避免将所有内容放在全局空间中。因此onCreate无法访问onclick。使其可访问的最小方法是在定义函数后添加window.onCreate = onCreate，但我不建议这样做。您应该添加一个导出的函数，您可以在初始化时使用按钮对象调用该函数并调用addEventListener("click", onCreate)，或者模块可以在页面上搜索特定元素（按ID，类名称等）并调用addEventListener("click", onCreate)。

未捕获错误：模块名称＆＃34; aaa_bbb_1_pb＆＃34;尚未加载上下文：_。使用require（[]）

1 个答案: