将Angular2 TypeScript文件和JavaScript文件分开到不同的文件夹中，可能是'disd'

提问者：小点点

将Angular2 TypeScript文件和JavaScript文件分开到不同的文件夹中，可能是'disd'

我正在使用angular的5分钟快速启动。io网站，其中包含如下文件结构：

angular2-quickstart
 app
   app.component.ts
   boot.ts
 index.html
 license.md
 package.json
 tsconfig.json

tsconfig.json是这样的代码块：

{
  "compilerOptions": {
    "target": "ES5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules"
  ]
}

还有包裹。json:

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
  },
  "license": "ISC",
  "dependencies": {
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  },
  "devDependencies": {
    "concurrently": "^1.0.0",
    "lite-server": "^1.3.1",
    "typescript": "^1.7.3"
  }
}

我将源地图从true更改为false，因此在代码编辑器中，地图文件不会再次生成，但js文件仍然会生成。

我想只处理ts文件，不想得到一个早午餐的js和js.map文件，我应该怎么做才能把我所有的ts文件放在我的常规开发flder像应用程序文件夹和所有的js和js.map文件到一个文件夹称为dist？

angular2网页包快速入门就是一个很好的例子。但我不知道他们是怎么做到的？

任何关于如何做到这一点的建议，当然不是手动的。

谢谢，

共3个答案

匿名用户

可能很晚，但这里有一个两步解决方案。

改变制度。配置。通过将'app'更新为'dist/app'：

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

现在看起来是这样的：

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

创建dist文件夹

编辑tsconfig。json并添加：

"outDir": "dist"

结果是tsconfig。json：

{
  "compilerOptions": {
    .
    .
    .
    .

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

运行npm start，您将看到所有编译的。js和。地图jsdist文件夹中的文件。

注意：浏览其他答案。它们也很有用，信息量也很大。

匿名用户

我的解决方案与上面的有点不同。我从这里定义的Angular2快速启动种子开始：https://github.com/angular/quickstart#create-a-new-project-based-on-the-quickstart

然后只更改了以下内容：

在tsconfig中添加了“outDir”：“./dist”。json

然后npm run start像以前一样工作（甚至html/css和其他文件没有任何复制），但是编译的. js和. map文件内置到dist/app中，并且不会污染您的src/app目录。

请注意，我还没有测试这对测试的影响。

匿名用户

我可能也迟到了，但我做到了

首先，照拉希尔·山说的做。

然后创建dist文件夹

创建文件夹后，转到文件tsconfig。json并添加以下内容：

"outDir": "dist"

结果是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"
  ]
}

如果您现在运行npm start并保存文件，您应该会在dist文件夹中看到所有已编译的. js和.map.js。