Mecanografiado 2.0+

En TypeScript 2.0, puede agregar una propiedad baseUrl en tsconfig.json :

 { "compilerOptions": { "baseUrl": "." // etc... }, // etc... }

Luego puedes importar todo como si estuvieras en el directorio base:

 import {XyService} from "services/validation/xy.service";

Además de esto, puede agregar una propiedad de paths , que le permite hacer coincidir un patrón y luego mapearlo. Por ejemplo:

 { "compilerOptions": { "baseUrl": ".", "paths": { "services/*": [ "services/validation/*" ] } // etc... }, // etc... }

Lo que le permitiría importarlo desde cualquier lugar así:

 import {XyService} from "services/xy.service";

A partir de ahí, deberá configurar el cargador de módulos que esté utilizando para admitir también estos nombres de importación. En este momento, el compilador de TypeScript no parece mapearlos automáticamente.

Puedes leer más sobre esto en el número de github . También hay una propiedad rootDirs que es útil cuando se usan varios proyectos.

Pre TypeScript 2.0 (todavía aplicable en TS 2.0+)

Descubrí que se puede hacer más fácil usando "barriles" .

1. En cada carpeta, cree un archivo index.ts .
2. En estos archivos, vuelva a exportar cada archivo dentro de la carpeta.

Ejemplo

En su caso, primero cree un archivo llamado my-app-name/services/validation/index.ts . En este archivo, tiene el código:

 export * from "./xy.service";

Luego cree un archivo llamado my-app-name/services/index.ts y tenga este código:

 export * from "./validation";

Ahora puede usar su servicio así ( index está implícito):

 import {XyService} from "../../../services";

Y una vez que tiene varios archivos allí, se vuelve aún más fácil:

 import {XyService, MyOtherService, MyOtherSerivce2} from "../../../services";

Tener que mantener estos archivos adicionales es un poco más de trabajo por adelantado (el trabajo se puede eliminar usando el mantenedor de barril ), pero he descubierto que al final vale la pena con menos trabajo. Es mucho más fácil realizar cambios importantes en la estructura del directorio y reduce la cantidad de importaciones que debe realizar.

Precaución

Al hacer esto, hay algunas cosas que debe observar y que no puede hacer:

1. Hay que estar atento a las reexportaciones circulares. Entonces, si los archivos en dos subcarpetas se referencian entre sí, deberá usar la ruta completa.
2. No debe volver a una carpeta desde la misma carpeta original (por ejemplo, estar en un archivo en la carpeta de validación y hacer import {XyService} from "../validation"; ). Encontré esto y el primer punto puede conducir a errores de importación que no se definen.
3. Finalmente, no puede tener dos exportaciones en una subcarpeta que tengan el mismo nombre. Sin embargo, por lo general eso no es un problema.

Es mejor usar la siguiente configuración en tsconfig.json

 { "compilerOptions": { "...": "reduced for brevity", "baseUrl": "src", "paths": { "@app/*": ["app/*"] } } }

Forma tradicional antes de Angular 6:

 `import {XyService} from '../../../services/validation/xy.service';`

debe refactorizarse en estos:

 import {XyService} from '@app/services/validation/xy.service

¡Corto y dulce!

Me acabo de encontrar con esta pregunta. Sé que se remonta ahora, pero para cualquiera que lo encuentre, hay una respuesta más simple.

Lo encontré solo porque algo que había estado haciendo durante mucho tiempo dejó de funcionar y me preguntaba si algo había cambiado en Angular 7. No, era solo mi propio código.

Independientemente, solo tuve que cambiar una línea en tsconfig.json para evitar rutas de importación largas.

 { "compilerOptions": { "...": "simplified for brevity", "baseUrl": "src" } }

Ejemplo:

 // before: import {XyService} from '../../../services/validation/xy.service'; // after: import { XyService } from 'app/services/validation/xy.service';

Esto me ha funcionado prácticamente desde que apareció Angular-CLI.