Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

typescript module resolution

Is there a typescript module resolution strategy that would allow me to have both local imports not starting with a slash and imports from node_modules in the same module?

With "moduleResolution" set to "node" the compiler cannot find my local modules, with all other options it does not see the modules in node_modules directory I'm trying to import.

I have the following imports in my file:

import {Injectable} from "angular2/core";
import {Logger} from "core/logging/Logger";

"angular2/core" is located in node_modules, "core/logging/Logger" is my local module.

I think that should be possible, if you look at angular's code they seem to have both, ie. in the http.ts module: https://github.com/angular/angular/blob/master/modules/angular2/src/http/http.ts

import {Injectable} from 'angular2/core'; //this is local
import {Observable} from 'rxjs/Observable'; //this probably comes from node_modules

More background info:
I have a project consisting of two subprojects:
- library
- app
Library defines some utilities which app then uses. My build process first builds the 'library' subproject, then copies it (compiled js along with d.ts files) to 'library' subfolder in 'app's node_modules, then compiles the 'app'.

In 'library' I have the following classes:

//file project/library/jsonparser/JSONParser.ts
class JSONParser {...} 

//file project/library/services/ConfigurationService.ts
import {JSONParser} from "../jsonparser/JSONParser"
class ConfigurationService {
  constructor(parser: JSONParser){ ... }
}

In 'app':

import {JSONParser} from "library/jsonparser/JSONParser" //this comes from node_modules in 'app'
import {ConfigurationService} from "library/services/ConfigurationService" //from node_modules
class AppConfigurationService extends ConfigurationService {
  constructor(parser: JSONParser) {
    super(parser);
  }
}

This won't compile as soon as JSONParser has any non public fields (they are imported from two different places so for typescript these are two different types). That is why I'm trying two import my modules without the slash at the start. But maybe there are other solutions to that?

like image 204
user5783821 Avatar asked Jan 13 '16 12:01

user5783821


People also ask

What is module resolution TypeScript?

Module resolution is the process the compiler uses to figure out what an import refers to. Consider an import statement like import { a } from "moduleA" ; in order to check any use of a , the compiler needs to know exactly what it represents, and will need to check its definition moduleA .

Does TypeScript support 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.

What is CommonJS vs ES6?

ES modules are the standard for JavaScript, while CommonJS is the default in Node. js. The ES module format was created to standardize the JavaScript module system. It has become the standard format for encapsulating JavaScript code for reuse.

Which of the following module resolution strategies are supported by the TypeScript compiler?

TypeScript includes two resolution strategies: Classic and Node.


1 Answers

I think that should be possible, if you look at angular's code they seem to have both, ie. in the http.ts module: https://github.com/angular/angular/blob/master/modules/angular2/src/http/http.ts

Not Trivial.

They have module resolution classic https://github.com/angular/angular/blob/6b73d09ba1d8c227d1b297341de2218aea5d1276/modules/angular2/tsconfig.json#L12

import {Observable} from 'rxjs/Observable'; //this probably comes from node_modules

The have a non trivial build pipeline specific to them that maps this to node_modules. See : https://github.com/angular/angular/blob/851647334040ec95d1ab2f376f6b6bb76ead0d9a/tools/broccoli/broccoli-typescript.ts#L271

like image 99
basarat Avatar answered Sep 21 '22 14:09

basarat