要求JS具有不同的依赖关系 [英] Require JS in different levels of dependency
问题描述
我正在使用Javascript,我正在使用Phonegap和googlemaps开发应用程序的项目太长,但现在我专注于使用Javascript的代码,但现在我已经在内部的目录和脚本的下一个结构 js 目录:
I'm working with Javascript and I'm working with a project too long to development application with Phonegap and googlemaps but now I focused in the code with Javascript, but now I've the next structure of directories and scripts inside js directory:
├── controlador
│ └── DeviceController.js
├── launcher.js
├── libs
│ ├── backbone.googlemaps.js
│ ├── backbone.js
│ ├── class.js
│ ├── index.js
│ ├── jquery.js
│ ├── jquery.mobile.min.js
│ ├── mustache.js
│ ├── require.js
│ └── underscore.js
├── modelo
│ └── Ubicacion.js
└── vista
├── GoogleMap.js
├── Informacion.js
├── MarcadorBahia.js
├── MarcadorDispositivo.js
├── MarcadorParqueadero.js
└── MarkerView.js
所以,我使用类库更容易使用javascript中的对象,我尝试使用Backbone,我做了这个示例,它有效!。
So, I use class library to work with object in javascript more easy, and I tried to work with Backbone and I did this example, it works!.
我的问题是什么时候我尝试使用 RequireJS ,我无法以正确的方式加载脚本。
My problem is when I try to work with RequireJS, I don't get to load the scripts the right way.
这是向我展示浏览器的错误:
This is the mistakes that show me the browser:
Uncaught ReferenceError: com is not defined launcher.js:18
(anonymous function) launcher.js:18
i.execCb require.js:29
Z.check require.js:18
(anonymous function) require.js:22
(anonymous function) require.js:8
(anonymous function) require.js:23
y require.js:7
Z.emit require.js:23
Z.check require.js:19
Z.enable require.js:23
Z.init require.js:16
E require.js:14
i.completeLoad require.js:27
i.onScriptLoad require.js:29
Uncaught TypeError: Cannot read property 'Model' of undefined Ubicacion.js:11
(anonymous function) Ubicacion.js:11
i.execCb require.js:29
Z.check require.js:18
Z.enable require.js:23
Z.init require.js:16
(anonymous function)
这是我的应用程序入口点的代码, launcher.js :
This is the code of the entry point of my application, the launcher.js:
require.config({
paths:{
jquery : 'libs/jquery',
googlemapapi: 'https://maps.googleapis.com/maps/api/js?key=AIzaSyC35BOQq2RvkKjzh0NhohKbQtUa3KWBM1o&sensor=false',
underscore : 'libs/underscore',
backbone : 'libs/backbone',
mustache : 'libs/mustache',
class : 'libs/class',
ubicacion : 'modelo/Ubicacion', // this class I required by DeviceController
deviceController: 'controlador/DeviceController'
}
});
require(['jquery', 'underscore', 'backbone', 'mustache', 'class','ubicacion','deviceController' ],
function($, _,Backbone,Mustache )
{
var deviceController = new com.gcvv.bsp.controller.DeviceController();
});
类DeviceController是:
The class DeviceController is:
require(['jquery', 'underscore', 'backbone','class','ubicacion' ],
function($, _, Backbone ){
$namespace( "com.gcvv.bsp.controller" );
$class( "com.gcvv.bsp.controller.DeviceController",{
$constructor: function(){
this.ubicacion = com.gcvv.bsp.modelo.Ubicacion(0,0);
},
getPosicionActual: function()
{
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(this.localizacion, this.error);
}else{
console.error("El dispositivo no soporta geolocalizacion");
}
},
localizacion : function(posicion){
this.ubication.set( 'longitud',posicion.coords.latitude );
this.ubication.set( 'latitud', posicion.coords.longitude);
},
error : function(){
console.error("Error al obtener la gelocalización del dispositivo");
}
});
});
这是 Ubicacion.js的代码:
require(['jquery', 'underscore', 'backbone','class'],
function($, _, Backbone) {
$namespace( "com.gcvv.bsp.modelo" );
$class("com.gcvv.bsp.modelo.Ubicacion",{
$extends: Backbone.Model,
defaults: {
longitud: 0,
latitude: 0
}
});
});
我尝试进行单元测试以了解问题是定义上下文的级别依赖(我想它),我尝试下面的事情:
I try to make a unit test to understand that the trouble is the level of the context to define the dependencies(well I suppose it), I try the next things:
- 我使用DeviceController(Ubicacion)中的类来测试这个工作
罚款 - 在Ubicacion课程中,我删除了必需的声明。
require.config({
paths:{
jquery : 'libs/jquery',
googlemapapi: 'https://maps.googleapis.com/maps/api/js?key=AIzaSyC35BOQq2RvkKjzh0NhohKbQtUa3KWBM1o&sensor=false',
underscore : 'libs/underscore',
backbone : 'libs/backbone',
mustache : 'libs/mustache',
class : 'libs/class',
ubicacion : 'modelo/Ubicacion',
deviceController: 'controlador/DeviceController'
}
});
require(['jquery', 'underscore', 'backbone', 'mustache', 'class','ubicacion','deviceController' ],
function($, _,Backbone,Mustache, $class, Ubicacion )
{
var ubicacion = new com.gcvv.bsp.modelo.Ubicacion();
console.log( ubicacion.get('longitud') ); //I get 0, default value
});
所以,带有变化的Ubicacion类:
So, the Ubicacion class with the changes:
$namespace( "com.gcvv.bsp.modelo" );
$class("com.gcvv.bsp.modelo.Ubicacion",{
$extends: Backbone.Model,
defaults: {
longitud: 0,
latitude: 0
}
});
我做错了什么?
如何在我需要使用的每个文件中定义require dependecies的正确结构?
How to define the right structure of the require dependecies in each file that I need to use?
如果我在不同的脚本中使用相同的依赖项而不重新加载,该怎么办? ?
How do I do if I use the same dependencies in different scripts to not reloaded?
如果我在不同的脚本中使用相同的依赖项以使它们不存在冲突,该怎么办?
How do I do if I use the same dependencies in different scripts so they do not present conflicts?
如何定义我的应用程序入口点的正确结构?
How to define the right structre of the entry point of my application?
推荐答案
我有同样的错误然后我引用此链接: https://groups.google.com/forum/ #!msg / camunda-bpm-users / mnd1RXAiR50 / veSaemAPVmAJ
I have the same error then i refer this link : https://groups.google.com/forum/#!msg/camunda-bpm-users/mnd1RXAiR50/veSaemAPVmAJ
只需清除缓存
希望它也适合你。
这篇关于要求JS具有不同的依赖关系的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!