Tuesday, July 28, 2015

Git Ignore to Untrack TypeScript Auto Generated Files

When using TypeScript you really don't want the transpiled output files created from the source .ts file to be committed to the repository. This is because the output could be looked at analogous to the /bin generated files which we all know are not to be committed. The TypeScript auto-generated files (.js and .js.map) will be built independently for each user's source, and only the single .ts file should be committed. 

The only exception I see to this process is if there is a restriction on TypeScript compiling on the server (i.e. CI build server) in which case the actual .js file might have to be committed. As long as the TypeScript compiler is present for compilation, only the .ts file should be committed.

To ignore the auto-generated .js and .js.map files for a new project the process is quite simple. Just add some rules to the .gitignore file at the root of your project like below and these files will not be tracked.

# Typescript Auto-generated files
# Note: all files must be TS files in this directory or ordinary JS files could be removed
# Modify as needed to preserve files and be more explicit
BowlingSPAWeb/BowlingSPA/app/*.js
BowlingSPAWeb/BowlingSPA/app/*.js.map
BowlingSPAWeb/BowlingSPA/app/controllers/*.js
BowlingSPAWeb/BowlingSPA/app/controllers/*.js.map
BowlingSPAWeb/BowlingSPA/app/services/*.js
BowlingSPAWeb/BowlingSPA/app/services/*.js.map

The above still needs to be done for existing projects, but if you see tracked changes already showing up for your repository, you are going to have to manually remove them from being tracked since they are already a part of the repository. From the Git docs:
If you already have a file checked in, and you want to ignore it, Git will not ignore the file if you add a rule later. In those cases, you must untrack the file first.
The easiest way to do this is to run the following command against the applicable files using Git Bash commands. I find opening the Git Bash command prompt directly from the directories makes this process easiest.

git rm --cached myfile.js
git rm --cached *.js
git rm --cached *.js.map

You may prefer instead of using wildcards (like above) to manually address each file individually applying the command. It's a 1 time deal to remove the tracking, so it might be best to be explicit as I did it below:


Note, once successfully removed, you can't run the command again or you will get an error message similar to the following:
fatal: pathpec 'myfile.js' did not match any files
This is because the file has already been removed from the repositories tracking so there isn't any command to preform against it.

If using VS.NET, you should see after refreshing that these files are now shown as being deleted from the repository. 





I do recommend that you commit from the Git Bash command line when removing these files. I had mixed results when jumping over to VS.NET to commit, as the deleted files were not shown as changes to the master to be synced to the server. Only once I committed from Git Bash did it actually apply and commit successfully:


After committing and on subsequent updates, the changes to the TypeScript auto-generated files should no longer be tracked and shown as 'Included Changes'

8 comments:

  1. We are using TypeScript in some part of a big project and we cannot ignore all of the js files.
    Is there any way to change the name of generated js file, (for example to xxx.generated.js) so that we can ignore all *.generated.js files

    ReplyDelete
  2. It seems with the java script and the files to wish to ignore already present in the index. by tracking the files
    git m -- cached Typescript.Content/Script?*.js
    git m -- cachednTypescriptTest.Content/Scripts/*.js.map

    ReplyDelete
  3. Sounds great, you shared very nice post, i read you mostly posts, one is My new computer with 7.0 windows score is superb post

    ReplyDelete
  4. Now only i am seeing this concept it is nice.

    ReplyDelete
  5. Thank you for sharing a useful unique informative blog with us. This is very useful in attaining the untrack typescript of auto generate files.

    ReplyDelete
  6. If you want to ignore every .js and .js.map file in the /app folder AND any folder beneath that, you can do this:

    BowlingSPAWeb/BowlingSPA/app/**/*.js
    BowlingSPAWeb/BowlingSPA/app/**/*.js.map

    If you need to exclude a specific file, you can add it to the .gitignore file with a "!" before it:

    !BowlingSPAWeb/BowlingSPA/app/controllers/bowlers.js

    For more info, you can check out this excellent documentation:
    https://git-scm.com/docs/gitignore

    ReplyDelete
  7. How do you handle doing a release if the generated .js code is not included? We are making a web project and we can simply point to a git repository and say "this is the released stuff".

    The problem is we'd need the .js files and yet it makes sense not to include them in the source but have the release be an artifact.

    ReplyDelete
  8. @Joel Dale - Yes in this case you would need the server (msbuild) to transpile the TypeScript files into .js files so they would be available for your app. This should be done by default using tsc.exe installed on the server reading the project's configured TS version in the .csproj file, or the highest version on the build server if not specified. See: http://www.typescriptlang.org/docs/handbook/compiler-options-in-msbuild.html

    ReplyDelete