Separate Angular2 TypeScript files and JavaScript files into different folders, maybe 'dist‘

Probably late but here is a two-step solution.

Step 1

Change system.config.js by updating 'app' to 'dist/app':

var  map = {
    'app':                        'app', // 'dist/app',
    .
    .
    .
};

Now it will look like this:

var  map = {
    'app':                        'dist/app', // 'dist/app',
    .
    .
    .
};

Step 2

Create the dist folder.

Edit tsconfig.json and add:

"outDir": "dist"

The resulting tsconfig.json:

{
  "compilerOptions": {
    .
    .
    .
    .

    "outDir": "dist" // Pay attention here
  },
  "exclude": [
    .
    .
    .
  ]
}

Run npm start and you should see all the compiled .js and .map.js files in the dist folder.

Note: Go through other answers. They are quite useful and informative too.

My solution is a bit different from the above. I was starting from the Angular2 Quickstart seed defined here: https://github.com/angular/quickstart#create-a-new-project-based-on-the-quickstart

And then only changed the following:

• Added "outDir": "../dist" to tsconfig.json
• Changed the baseDir attribute inside bs-config.json to "baseDir": ["dist", "src"]

Then npm run start works as before (even html/css and other files without any copying), but compiled .js and .map files are built into dist/app and won't pollute your src/app directory.

Please note that I haven't tested how this affects testing yet.

I may be also late but I did this.

First do what raheel shan said.

Then create the dist folder.

After creating the folder go to the file tsconfig.json and add this:

"outDir": "dist"

The resulting tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "outDir": "dist"
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

If you now run npm start and save a file you should see all the compiled .js and .map.js in the dist folder.