node.jsgulpgulp-typescript

Managing Relative file paths in gulp build


I realise this is a real beginner question but for some reason, I haven't been able to find the right search terms for an answer.

I am setting up a nodeJS site, with Gulp running my builds. Part of this is Typescript & SCSS compilation, with the outputs being inputted to dist/js. So my files look something like this:

.
├── dev
|   ├── app.ts
|   └── utils
|         └──file1.ts
|         └──someFunction
|                └──file2.ts
└─── dist
    └── js
         ├── file1.js
         └── file2.js

So a reference from file1.ts to ./someFunction/file2 should be ./file2 after compilation (i.e. referencing from the dist file. However, I am getting errors because gulp and typescript aren't changing the references (I didn't expect them too as I haven't made any attempt to tell them too!). How is this typically handled?


Solution

  • I normally try to keep the same paths between development and production to avoid the problem you are having. Another option is to combine the files into one destination file and minimize (uglify) it for inclusion. If you do not want to do that, there are gulp plugins to replace text (gulp-replace, gulp-html-replace, etc...) so you could remove specific paths.

    You can have the Typescript compiler place your files in the dist/js directory without a path using --outdir (Typescript compiler options)