Question

我正在关注Angular 2 quick start教程。以下是我的文件夹结构 -

├── gulpfile.js
├── index.html
├── js
|   ├── app.component.js
|   └── boot.js
├── source
|   ├── app.component.ts
|   └── boot.ts
├── node_modules
    ├── module 1
    └── module 2

我的打字稿文件位于source/目录中。我正在将它编译到js/目录。我正在使用gulp-typescript。

问题在于，例如，当我将文件boot.ts重命名为bootstrap.ts并再次编译时，会创建相应的bootstrap.js文件但旧的boot.js文件仍然存在在js /目录中。

现在文件夹结构如下所示 -

├── gulpfile.js
├── index.html
├── js
|   ├── app.component.js
|   └── bootstrap.js
|   └── boot.js
├── source
|   ├── app.component.ts
|   └── bootstrap.ts
├── node_modules
    ├── module 1
    └── module 2

我想通过gulp任务自动删除此boot.js。怎么做到这一点？

Answer 1

我来到这里看到了标题，并且在混合物中添加含量不是解决方案。所以这就是我如何解决它。

使用rm -rf js &&

为您的npm构建脚本添加前缀

"scripts": {
    ...
    "build": "rm -rf js/ && tsc",
    ...
},

希望有人会觉得这很有用。

按照评论
中的建议进行编辑

作为一种更通用的解决方案，请使用rimraf代替rm -rf。 rimraf是一个npm模块，旨在跨平台（包括Windows）工作。要使其工作，首先将其安装为dev依赖项。

Answer 2

安装gulp del。

$ npm install --save-dev gulp del

创建任务。

var gulp = require('gulp');
var del = require('del');

gulp.task('clean:output', function () {
  return del([
    'js/'
  ]);
});

gulp.task('default', ['clean:output']);

您可以在gulp del here找到更多信息。

Answer 3

使用最新的tsc，您可以使用以下命令进行清理

tsc --build --clean

我的tsc版本供您参考

$ tsc --version
Version 3.5.3

请注意--clean标志是project-references的一部分，并且仅与它一起使用。

Answer 4

此解决方案的灵感来自@Akash Kurian Jose's answer。由于他的解决方案取决于您使用的操作系统，因此我添加了一个可以在任何操作系统上使用的解决方案：

添加rimraf作为开发人员依赖项：

"devDependencies": {
   "rimraf": "^3.0.1"
}

然后将这3个脚本添加到package.json：

"rimraf": "./node_modules/rimraf/bin.js",
"clean" : "rimraf js/",
"compile": "npm run clean && tsc -p ./"

执行npm run compile时，js/文件夹将在编译前被清除。

Answer 5

此解决方案是对 GabrielBB 解决方案的改进。

安装rimraf npm i rimraf -D

添加以下 npm 脚本

"clean": "rimraf js/",
"prebuild": "npm run clean",
"build": "tsc",

这利用了 npms 自动 Pre scripts

Answer 6

我使用here中的脚本。

在package.json中添加脚本：

"build": "node jsDelete.js && npx tsc -w"

并添加jsDelete.js：

const fs = require('fs');
const Path = require('path');

const deleteFolderRecursive = function(path) {
  if (fs.existsSync(path)) {
    fs.readdirSync(path).forEach((file, index) => {
      const curPath = Path.join(path, file);
      if (fs.lstatSync(curPath).isDirectory()) { // recurse
        deleteFolderRecursive(curPath);
      } else { // delete file
        fs.unlinkSync(curPath);
      }
    });
    fs.rmdirSync(path);
  }
};

deleteFolderRecursive('path_to_folder')

Answer 7

如果有人会遇到这个问题：我试图使用 tsc --build --clean 但有时如果你重命名了很多 .ts 文件，这个命令在 mac 上运行：

如果您重命名了很多 .ts 则删除 .js 文件（这是针对 Mac 用户的）：

find . -name '*.js' ! -path './node_modules/*' -delete

如果 declaration: true 在您的 tsconfig 文件中，您可能需要：

find . -name '*.d.ts' ! -path './node_modules/*' -delete

删除文件前不要忘记git commit

Answer 8

使用 Git 和 Bash 进行破解

git add . && git stash &&  find . \\( -name '*.js' -o -name '*.js.map' \\) ! -path './node_modules/*' -delete  && git restore . && git stash pop

Answer 9

您可以运行：tsc -b YOUR_ENTRYPOINT_LIST --clean 如前所述here。

示例：

tsc -b src test --clean 将根据各自的 src 构建 test 和 tsconfig.json 目录，然后清理（删除）生成的 .js 文件。

您可以有一个主 tsconfig.json 并在每个子文件夹配置文件中简单地使用 {extend: "path_to_main_tsconfig"}。

建议：

在运行这个命令之前，用 --dry 试试看会发生什么。

如何从以前的打字稿（.ts）文件中删除已编译的JS文件？

9 个答案:

示例：

建议：