Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to import .html fragment using es6 syntax in TypeScript

How to import an HTML template from a relative path like this:

import customSelectHtml from "./custom-select.html!text";

TypeScript compiler complains that it cannot find module. I was trying to create an ambient module definition, but it doesn't allow relative paths in module names. I am using SystemJS as a module loader.

like image 812
rgripper Avatar asked Mar 26 '16 10:03

rgripper


People also ask

Does TypeScript use CommonJS?

TypeScript supports export = to model the traditional CommonJS and AMD workflow. The export = syntax specifies a single object that is exported from the module. This can be a class, interface, namespace, function, or enum.

Does TypeScript use ES6 modules?

TypeScript 1.5 supports ECMAScript 6 (ES6) modules. ES6 modules are effectively TypeScript external modules with a new syntax: ES6 modules are separately loaded source files that possibly import other modules and provide a number of externally accessible exports.

What module syntax do you use when writing TypeScript?

TypeScript offers support for creating and using modules with a unified syntax that is similar to the ES Module syntax, while allowing the developer to output code that targets different module loaders, like Node. js (CommonJS), require. js (AMD), UMD, SystemJS, or ECMAScript 2015 native modules (ES6).


1 Answers

It is impossible.

Due to the definition of what is module in typescript, and as far as I know in ES6 javascript (import). Module cannot be html. The common approach is to import a javascript module that exports a string containing html, css, whatever. But that is not importing of the file with raw html.

Maybe you want to have a look at html imports also, but that is completely different thing.

like image 89
Amid Avatar answered Oct 04 '22 21:10

Amid