2016-10-20 11 views
3

У меня есть AMD module, который я хочу загрузить SystemJS. Я могу это сделать, но, к сожалению, я должен назвать это так:Как избавиться от свойства «по умолчанию» при загрузке модулей с помощью SystemJS?

var Logdown = module.default; 
var instance = new Logdown('Test'); 

Я хотел бы, чтобы пропустить сделать вызов .default, но я не знаю, как избавиться от этой собственности. Я думаю, что этот default каким-то образом назначен загрузчиком SystemJS.

Это мой модуль:

logdown.js

define('Logdown', function() { 
    function Logdown(name) { 
    this.name = name; 
    } 

    Logdown.prototype.log = function() { 
    console.log(this.name); 
    }; 

    return Logdown; 
}); 

А вот моя конфигурация SystemJS:

SystemJS.config({ 
    baseURL: '/dist', 
    map: { 
    'logdown': 'lib/dynamic/logdown/logdown.js' 
    } 
}); 
+1

Что вы имеете в logdown.js, называется «named module» в [spec] (http://requirejs.org/docs/whyamd.html#namedmodules), с которым вы связались, и этот документ гласит: «Вы должны избегайте именования модулей самостоятельно, и только размещайте один модуль в файле во время разработки. Однако для инструментария и производительности решение для модуля нуждается в способе идентификации модулей в встроенных ресурсах ». Для SystemJS, назвав модуль в 'logdown.js', этот файл превращается в пакет, а не в модуль. И ваш вопрос невозможно ответить, не видя полного исходного кода, который импортирует этот модуль. – artem

+0

Спасибо за разъяснение, artem.☺ –

+0

'default' не создается загрузчиком модуля, а скорее декларацией экспорта. – Bergi

ответ

1

TL; DR

Используйте import ... from "..."; вместо import ... = require("..."); при использовании named AMD modules в коде типа TypeScript.

Объяснение

Мое главное приложение (с использованием Logdown модуля) записывается в машинописном и компилируется ES5 кода. С помощью этой установки я заметил, что разница в выходе зависит от используемого синтаксиса импорта TypeScript.

Вот различия:

import Logdown from "logdown"; 

export default class Main { 

    constructor(message: string) { 
    let logger: Logdown = new Logdown('Test'); 
    logger.log(); 
    } 
} 

компилирует:

System.register(["logdown"], function(exports_1, context_1) { 
    "use strict"; 
    var __moduleName = context_1 && context_1.id; 
    var logdown_1; 
    var Main; 
    return { 
    setters: [ 
     function(logdown_1_1) { 
     logdown_1 = logdown_1_1; 
     }], 
    execute: function() { 
     Main = (function() { 
     function Main(message) { 
      var logger = new logdown_1.default('Test'); 
      logger.log(); 
     } 

     return Main; 
     }()); 
     exports_1("default", Main); 
    } 
    } 
}); 

И:

import Logdown = require("logdown"); 

export default class Main { 

    constructor(message: string) { 
    let logger: Logdown = new Logdown('Test'); 
    logger.log(); 
    } 
} 

компилирует:

System.register(["logdown"], function(exports_1, context_1) { 
    "use strict"; 
    var __moduleName = context_1 && context_1.id; 
    var Logdown; 
    var Main; 
    return { 
     setters:[ 
      function (Logdown_1) { 
       Logdown = Logdown_1; 
      }], 
     execute: function() { 
      Main = (function() { 
       function Main(message) { 
        var logger = new Logdown('Test'); 
        logger.log(); 
       } 
       return Main; 
      }()); 
      exports_1("default", Main); 
     } 
    } 
}); 

Важная часть заключается в том, что при использовании import Logdown from "logdown"; скомпилированный код типа TypeScript создаст новые экземпляры, подобные этому var logger = new logdown_1.default('Test');.

Но при использовании import Logdown = require("logdown");, скомпилированный код типа TypeScript не добавляет свойство default, а вместо этого создает такие экземпляры: var logger = new Logdown('Test');.

Итак, с модулем типа I (named AMD module), мне нужно использовать синтаксис import ... from "...";.

 Смежные вопросы

  • Нет связанных вопросов^_^