module: "system" and outFile generates wrong module names

[pocesar]

TypeScript Version: 2.4.0-dev.20170519

Code

this Typescript code (on the main project)

'use strict'

import { createStore, applyMiddleware, combineReducers } from 'redux'
import { routerReducer, LOCATION_CHANGE } from 'react-router-redux'
import { handleActions, Action } from 'redux-actions'
import { Login, Data, Groups } from 'cim-typings'
import { Initials } from 'cim-shared-ui/helpers'
import * as RActions from './actions'

generates

System.register("reducers", ["redux", "react-router-redux", "redux-actions", "../../cim-shared-ui/helpers", "actions"], function (exports_2, context_2) {
/* ... */
})

which is wrong. "../../cim-shared-ui" should be "cim-shared-ui", because it's a npm linked package. not sure if the problem is the link itself, because I have this, and works correctly, which is also from the main project:

'use strict'

import React from 'react'
import { Data } from 'cim-typings'

System.register("components/status", ["react", "cim-typings"], function (exports_5, context_5) {
/* ... */
})

tsconfig.json as follows:

{
  "exclude": [
    "./node_modules",
    "./jspm_packages",
    "./dist"
  ],
  "include": [
    "./generic.d.ts",
    "src/*.ts",
    "src/*.tsx",
    "src/**/*.tsx",
    "src/**/*.ts"
  ],
  "compilerOptions": {
    "module": "system",
    "jsx": "react",
    "target": "es5",
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "rootDir": "src",
    "newLine": "LF",
    "allowJs": false,
    "noImplicitAny": true,
    "baseUrl": "./",
    "noEmitOnError": true,
    "sourceMap": true,
    "alwaysStrict": true,
    "inlineSourceMap": false,
    "paths": {
      "*": [
        "node_modules/@types/*",
        "*"
      ]
    },
    "lib": [
      "dom",
      "es2015",
      "es5"
    ],
    "outFile": "dist/app.js"
  }
}

Expected behavior:

module: "system" should output dependencies as authored

Actual behavior:

TS is trying to do something funny with the paths, and it's inconsistent with other npm linked packages. The only difference between the two is that cim-typings is a commonjs module, and cim-shared-ui is a system module

[pocesar]

I first thought it was a problem with JSPM jspm/jspm-cli#2275 but it's really a mix of outFile and module "system" from Typescript

[aluanhaddad]

Does cim-typings declare the typings for the module cim-shared-ui?

[pocesar]

no, it's unrelated from each other

cim-typings has only consts (language mappings) and interfaces and types, a flat directory structure, with the following tsconfig.json and has no dependencies:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "noImplicitAny": false,
        "noEmitOnError": true,
        "sourceMap": false,
        "declaration": true,
        "listEmittedFiles": true,
        "preserveConstEnums": true
    },
    "exclude": [
        "test.ts"
    ]
}

cim-shared-ui is a system module, with a flat directory structure, and the tsconfig.json above

both are npm linked to my cim-prefeitura project, and while cim-typings just work, cim-shared-ui doesn't, with the improper module name as said in the first post

[aluanhaddad]

The reason I ask is that the name cim-typings implies that the package contains nothing but types. If that is the case, then it doesn't serve as a reference point for the expected behavior of cim-shared-ui because all imports will be elided from the output code anyway.

[pocesar]

it has .js files, like I said, it has exported consts objects like such:

// file is data.ts
export interface Statistics {
  number: number;
  name: string;
}

export interface LatLng {
  lat: number;
  lng: number;
  accuracy?: number;
}

export type MaritalStatus = 'solteiro' | 'casado' | 'divorciado' | 'viuvo' | 'separado';

export const MaritalStatusTypes: Record<MaritalStatus, string> = {
  casado: 'Casado',
  divorciado: 'Divorciado',
  separado: 'Separado',
  solteiro: 'Solteiro',
  viuvo: 'Viúvo'
}

compiled to

// file is data.js
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MaritalStatusTypes = {
    casado: 'Casado',
    divorciado: 'Divorciado',
    separado: 'Separado',
    solteiro: 'Solteiro',
    viuvo: 'Viúvo'
};

I decided to put the typings and consts in that file because I use it in 3 distinct react frontends and a react native android app.

[aluanhaddad]

I see, I was just put off by the name of the package.

Also, I tried to reproduce but I couldn't.

[pocesar]

looks somewhat like #15876

I'll try to make a minimal repro

this is my main project that has cim-typings and cim-shared-ui npm link'ed:

this is cim-typings:

and this is cim-shared-ui:

[aluanhaddad]

I just looked over this again and I think it is a bug in TypeScript because module specifiers are never supposed to be rewritten. Having said that, I couldn't reproduce the bug.

[pocesar]

is there at least any workaround for this? the side-by-side .d.ts generation really mess this up

[pocesar]

still happening in 2.5.0-dev