typescript - Kall tekst-pluginen fra requirejs-mapping

Jeg skriver en webapp ved hjelp av TypeScript, Backbone og Mustache. Jeg vil bruke Requirejs for avhengighetslading.

Jeg bruker også Web Essentials Visual Studio-pluginen for TypeScript med AMD-kompileringsalternativet aktivert. For de som ikke er kjent med dette, vil det pakke TypeScript-filen din i en AMD-modul dersom du importerer eksterne moduler. For eksempel:

I TypeScript importerer jeg følgende moduler i type-definisjonsfiler.

export import Backbone = module("Backbone"); 
import mainTemplate = module("MainTemplate");

Utdataen er noe som dette:

define(["require", "exports", "Backbone", "MainTemplate"], function(require, exports, __Backbone__, __mainTemplate__) {
//...code goes here ...
});

For malen har jeg erklært følgende i en fil for typedefinisjon:

declare module "MainTemplate" { }

For å støtte requirejs-plugins, må du erklære modulen din som:

declare module "text!MainTemplate.html" { }

Jeg vil gjerne holde modulnavnet fritt for plugins og filtillegg. Dette vil gi meg litt fleksibilitet i fremtiden.

Jeg har følgende kartlegging i require.

require.config({
    map: {
        "MyModule": {
            "MainTemplate": "text!MainTemplate.html"
        }
    }
}

Dette kaller vellykket tekstpluginet, men pluginet laster feil URL. Når jeg går gjennom kildekoden for tekstpluginet, fant jeg ut at følgende kode er synderen.

load: function (name, req, onLoad, config) {
  ...
  url = req.toUrl(nonStripName),
  //returns "scripts/**text!**MainTemplate.html**.html**"
  ...
}

Hvis jeg navngir modulen 'MainTemplate.html', fungerer det fint, men jeg vil gjerne holde filtypen ute av modulnavnet.

Jeg har endret tekst-pluginen med en enkel regex-erstatning for å fjerne plugin-referansen og den dupliserte utvidelsen.

Er det en bedre måte å håndtere dette på?

Svar #1

Støtte på lignende problem. Løst til slutt. Se TypeScript: kompilering fjerner urefererte imports

/// <amd-dependency path="text!templates/application.htm" />

var applicationTemplate = require('text!templates/application.htm');

Svar #2

For Typescript 1.0 fungerer dette for meg. Først opprettet jeg en .d.ts-fil som lagrer alle moduldeklarasjoner for hver tekstmal.

//workaround for typescript's lack of support for requirejs text template notation
//remember that a reference to the import variable has to be found in the class, otherwise typescript ignores the import
declare module "text!views/details/details.html" {
    var text: string;
    export = text;
} 
declare module "text!views/layout/layout.html" {
    var text: string;
    export = text;
} 
declare module "text!views/home/home.html" {
    var text: string;
    export = text;
}

så for å referere til tekstmalen legger jeg til disse linjene øverst i klassen/modulen.

/// <reference path="../texttemplate.d.ts"/>
import detailsTemplate = require('text!views/details/details.html');

Referanselinjen er egentlig ikke nødvendig, siden .d.ts-filen blir plukket opp globalt. Men jeg la den til som en påminnelse om løsningen. Den gjør det også enkelt å ctrl+klikke for å gå til .d.ts-filen.

Relaterte artikler