Jump to content
Johnny Saymon

Require JS e módulos

Recommended Posts

Boa tarde.

 

Estou tentando modularizar meu código Javascript, e iniciei tentando trabalhar com o RequireJS mas ainda não consegui compreender a lógica, acredito que com um exemplo será melhor para explicar meu problema, abaixo colocarei o mínimo de código possível para ilustrar o problema, segue:

 

// arquivo ClasseY.js
define(["require", "exports", "pacote-x"], function (require, exports, pacote-x) {
    "use strict";

    Object.defineProperty(exports, "__esModule", { value: true });

    var ClasseY = (function () {
        function ClasseY {
            // código
        };
        
        return ClasseY;
    })();

    exports.ClasseY = ClasseY;
});

Tenho outras "classes" que compõe esse pacote seguindo essa mesma estrutura do código acima.

Rodei o RequireJs Optimizer para unir todos os arquivos em um só que chamei de "main.js", com isso tive uma concatenação e minificação do código que resultou em algo assim:

 

define("ClasseY",["require","exports","pacote-x"],function(t,e,o){"use strict"; // e todo o restante do código segue...

Por fim, parti para o html utilizando essas tags

 

<script type="text/javascript" src="require.js"></script>
<script type="text/javascript">
	require(["main"], function(m){
		var y = new m.ClasseY;
	});
</script>

Mas meu código não funcionou, o Require JS até vai buscar o arquivo "main.js" mas o parâmetro "m" é "undefined".

 

Onde está o erro? Esse é um bom fluxo de trabalho?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Motta
      O supercomputador mais rápido do mundo chega aos EUA em 2021
       
       
      "O supercomputador deve ser capaz de executar mais de 1,5 exaflops de processamento. "
    • By gust.php
      Prezados, bom dia.   Estou tentando diferenciar o layout de um modulo dos demais, todos os modulos do meu sistema tem um mesmo layout com o mesmo menu, quero que todos fiquem igual ao layout do modulo Application, e o modulo cliente seja diferente. Estou tentando assim:   No modulo Application o arquivos module.config.php esta assim:     'view_manager' => array( 'display_not_found_reason' => true,          'display_exceptions'       => true,          'doctype'                  => 'HTML5',          'not_found_template'       => 'error/404',          'exception_template'       => 'error/index',          'template_map' => array(              'layout/layout'           => __DIR__ . '/../view/layout/layout.phtml',              'application/index/index' => __DIR__ . '/../view/application/index/index.phtml',              'error/404'               => __DIR__ . '/../view/error/404.phtml',              'error/index'             => __DIR__ . '/../view/error/index.phtml', ),          'template_path_stack' => array(             'application' => __DIR__ . '/../view', ), 'strategies' => array( 'ViewJsonStrategy', ), ),     Em todos os outros modulos estou fazendo assim:     'view_manager' => array( 'display_not_found_reason' => true,          'display_exceptions'       => true,          'doctype'                  => 'HTML5',          'not_found_template'       => 'error/404',          'exception_template'       => 'error/index',          'template_map' => array(              'layout/layout'           => __DIR__ . '/../../Application/view/layout/layout.phtml',  ----> Estou usando o layout de Application, esta funcionando.              'cadastro/index/index' => __DIR__ . '/../view/cadastro/index/index.phtml',              'error/404'               => __DIR__ . '/../view/error/404.phtml',              'error/index'             => __DIR__ . '/../view/error/index.phtml',          ),     Quando faço o login, chamo a rota homecli. Beleza, isso funciona. Só que, quando logo com um outro usuário qualquer, ele carrega o layout do cliente, ele não carrega mais o layout do Application, ele sempre carrega o layout do cliente.   Arquivo module.config.php modulo cliente:     'view_manager' => array( 'display_not_found_reason' => true,          'display_exceptions'       => true,          'doctype'                  => 'HTML5',          'not_found_template'       => 'error/404',          'exception_template'       => 'error/index',          'template_map' => array(              'layout/layout'           => __DIR__ . '/../view/layout/layout.phtml',              'cliente/index/index' => __DIR__ . '/../view/cliente/index/index.phtml',              'error/404'               => __DIR__ . '/../view/error/404.phtml',              'error/index'             => __DIR__ . '/../view/error/index.phtml', ),    
    • By diegohamaz1
      Pessoal tudo bem?
       
      Tenho um arquivo em knckoutJS do meu site em magento
       
       
      define( [ 'jquery', 'ko', 'uiComponent', 'mage/url', 'mage/storage', 'Teste_AdvancedGrid/js/view/price', 'Magento_Customer/js/customer-data' ], function ($, ko, component, urlBuilder, storage , priceRender, customerData) { "use strict"; return component.extend({ // CLASS Product Product : function(id, sku , name , urlThumb ) { this.id = ko.observable(id); this.sku = ko.observable(sku); this.name = ko.observable(name); this.urlThumb = ko.observable(urlThumb); }, // CLASS CartItem CartItem : function(product, quantity) { var self = this; // Scope Trick self.product = ko.observable(product); self.quantity = ko.observable(quantity || 1); self.cost = ko.computed(function(){ return self.product().price() * self.quantity(); }); self.increaseQuantity = function() { self.quantity(self.quantity() + 1); }; self.formatMoney = function() { return "R$ " + self.cost().toFixed(2); }; }, // CLASS ViewModel ViewModel : function() { /** * Scope Trick * @type {[type]} */ var self = this; getModel: function(data, event) { var brand = $("#marca").val(); var self = this; var serviceUrl = urlBuilder.build('/grid/index/product?type=model&brand='+brand); return storage.get(serviceUrl,'').done( function (response) { var dados = JSON.parse(response); self.model(dados); } ).fail( function (response) { console.log(response); } ); }, initialize: function () { this._super(); }, _render:function(){ }, defaults: { template: 'Teste_AdvancedGrid/grid', }, }); } ); E tenho um JS que é invocado na mesma pagina com RequireJS
       
      requirejs(['algoliaBundle', 'knockout'], function(algoliaBundle , ko) { algoliaBundle.$(function ($ ,ko ) { if (!this.ko) { this.ko = ko; }; //AQUI QUE QUERO INVOCAR A FUNÇÂO DO KNOCKOUT this.getModel(parametro); }); }); Eu gostaria de chamar a função do Knockout "getModel" no arquivo acima passando um parametro como this.getModel(parametro) , mas não sei como invocar a view model no arquivo acima, alguem pode me ajudar ? Não sei como instaciar a View Model do magento no requireJS
       
    • By Johnny Saymon
      Bom dia!
       
      Estou com uma dificuldade em alinhar um desenvolvimento para Front usando Typescript, RequireJs e pacotes NPM, Bower, Yarn e etc.
       
      Meu objetivo: Criar códigos Typescript, separar o desenvolvimento em módulos AMD e chama-los através do RequireJs. Estava funcionando bem até chegar a um módulo composto por dois ou mais arquivos que são mesclados em um único arquivo, até aqui consegui com um relativo sucesso, mas tive um pequeno problema, a chamada para os meus pacotes ficaram assim:
       
      define("Alvo", ["require", "exports", "../node_modules/@organizacao/pacote/index"], function (require, exports, pacote) { // Código }); Quando o objetivo era obter algo como:
      define("Alvo", ["require", "exports", "@organizacao/pacote"], function (require, exports, pacote) { // Código }); O que resolvi editando o arquivo gerado manualmente, mas isso não é algo prático.
       
      Vocês tem alguma sugestão? Estou indo no caminho correto? Existe uma forma melhor de se trabalhar?
    • By oomaikoo
      Boa tarde galera, estou tentando ativar o modulo Worker no meu servidor apache porém sem sucesso acontece o seguinte erro:

      Starting httpd httpd Syntax error on line 105 of /etc/httpd/conf/httpd.conf Syntax error on line 11 of /etc/httpd/conf.d/php.conf Cannot load modules/libphp5-zts.so into server /etc/httpd/modules/libphp5-zts.so cannot open shared object file No such file or directory

      logicamente, é porque não existe o arquivo libphp5-zts.so no meu servidor, como faço para conseguir baixar esse arquivo? eu não tenho acesso ROOT para fazer o download via terminal, mas tenho acesso para fazer o upload do arquivo, será que vocês podem me ajudar?
      Aguardo um retorno. Obrigado
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.