Typescript import using path from some root

Question

Is there any simple way to set up so that I can import starting from some root point?

e.g.:

- module1
   \- file1.ts
- module2
   \- file2.ts

in file2 i want to import file1

import { foo } from '../module1/file1'

What I would like to do instead is something like:

import { foo } from 'src/module1/file1'

Angular2 somehow uses this (see https://github.com/angular/angular/blob/master/modules/angular2/src/core/compiler/compiler.ts). I looked into their build process, but it's so complex, I'm not sure how they enabled this.

gilamran · Accepted Answer · 2015-08-24 21:14:31Z

1

All ES6 imports are relative, angular2 are using systemjs to handle all the imports/exports. And in the systemjs configuration you can define a map. (I wouldn't go there)

You have to remember that imports in ES6 are just loading javascript files, so if src is your root, you should be able to just import from /src/module1/files

answered Aug 24, 2015 at 21:14

gilamran

7,3144 gold badges33 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Necros Over a year ago

My app is actually a node app, so typescript is transpiled to ES5 and require. I don't think you can import from root with require, unless you hack it somehow or force the compiler to generate correct relative path for you.

Necros · Accepted Answer · 2016-05-14 08:53:21Z

1

https://www.npmjs.com/package/app-module-path seems to be the best solution for node.

Update:

I use it like this

root
  \- module1
  |  \- file1.ts
  \- module2
  |  \- file2.ts
  \- main.ts

main.ts is entry point for the application, and these are the first two lines:

import * as path from 'path';

require('app-module-path').addPath(path.resolve(__dirname, '..'));

then from module2/file2.ts i can do this:

import { Stuff } from 'root/module1/file1';

edited May 14, 2016 at 8:53

answered Aug 26, 2015 at 16:38

Necros

3,03425 silver badges30 bronze badges

2 Comments

CharlyDelta Over a year ago

Did you manage to get app-module-path to work? Because it does not work for me using it.

Necros Over a year ago

Yes, see updated answer. This worked for me for any version of node I ran.

Chris Curnow · Accepted Answer · 2017-06-07 05:46:17Z

1

I am working with Angular CLI and the standard structure it produces.

So everything I work with is in src/app.

My main HTTP service is located at src/app/services/httpService.ts.

To get import this service I use:

import { HttpService } from 'app/services/httpService'

I'm not sure if this relies on any special config that Angular CLI does (and I realise Angular CLI wasn't around at the time this question was posted) but it would be worth a try in your environment.

answered Jun 7, 2017 at 5:46

Chris Curnow

6535 silver badges16 bronze badges

1 Comment

Necros Over a year ago

This is a feature of typescript compiler, that has been improved a lot since this question, there is also a setting where you can configure custom paths (typescriptlang.org/docs/handbook/module-resolution.html). Also there are (or used to be) some differences between node and browser module resolution.

Collectives™ on Stack Overflow

Typescript import using path from some root

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related