gulp-typescript icon indicating copy to clipboard operation
gulp-typescript copied to clipboard

Not produce json module to destination directory ?

Open dimaslanjaka opened this issue 4 years ago • 18 comments

Expected behavior: JSON File (resolve json module) not copied into destination directory

Actual behavior: Not copying json files

Environment:

  • node 12.x 14.x
  • typescript 4.4.4 until latest
  • gulp latest (4.x)

Your gulpfile:

Include your gulpfile, or only the related task (with ts.createProject).

import gulpCore from "./src/gulp-core";
import { PostHeader } from "./src/types/post-header";
import { readdirSync } from "fs";
import { join } from "path";
import chalk from "chalk";
import ts from "gulp-typescript";
import gulp from "gulp";
import merge from "merge2";

function defaultTask(cb) {
  gulpCore({
    input: readdirSync(join(__dirname, "xml")).map((xml) => {
      return join(__dirname, "xml", xml);
    }),
    output: "./build/export/gulp",
    callback(content: string, headers: PostHeader): string {
      console.log("gulp process post", chalk.magenta(headers.title));
      return content;
    },
    hostname: ["webmanajemen.com", "web-manajemen.blogspot.com", "dimaslanjaka.github.io"],
  });
  // place code for your default task here
  cb();
}

function compileTs(done) {
  const tsProject = ts.createProject("tsconfig.publish.json");
  const tsResult = tsProject.src().pipe(tsProject());

  return merge([tsResult.dts.pipe(gulp.dest("dist")), tsResult.js.pipe(gulp.dest("dist"))]);
}

exports.default = defaultTask;
exports.tsc = compileTs;

tsconfig.json

Include your tsconfig, if related to this issue.

{
  "compilerOptions": {
    "allowJs": true,
    "checkJs": false,
    "allowUnusedLabels": true,
    "allowSyntheticDefaultImports": true,
    "allowUmdGlobalAccess": true,
    "allowUnreachableCode": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "declaration": true,
    "declarationMap": false,
    "declarationDir": "dist/types",
    "outDir": "dist"
  },
  "include": ["src", "__test__"],
  "exclude": ["src/lang"]
}

Code

Include your TypeScript code, if necessary.

// just import section, the problem is Why not copying json file to destination directory ?
import StringBuilder from "./StringBuilder";
import excludeTitleArr from "./excludeTitle.json";

Source

Screenshot from 2021-11-01 11-36-20

Compiled

Screenshot from 2021-11-01 11-34-32

dimaslanjaka avatar Nov 01 '21 04:11 dimaslanjaka

@ivogabe: as a step in gradually taking on the maintaining work (#664), can you narrow down the potential problematic zone so I can look into it ?

haoadoreorange avatar Nov 02 '21 23:11 haoadoreorange

I guess that the problem is that we don't load JSON files in tsProject.src() and/or that we don't push .json files to the output streams (tsResult.js and the main stream tsResult).

ivogabe avatar Nov 03 '21 09:11 ivogabe

I guess that the problem is that we don't load JSON files in tsProject.src() and/or that we don't push .json files to the output streams (tsResult.js and the main stream tsResult).

I've tried using gulp.src(["src/**/*.{js,ts,json}"]) and tsProject.src(["src/**/*.{js,ts,json}"]), the result still not copying the json files. And made the program wont run because json not found.

If i compile with tsc -p tsconfig.publish.json json file copied successful, but on CI the tsc -p tsconfig.publish.json EACCESS idk, when i run ls, the tsconfig.publish.json exists in lists. [FIXED]

But i tried using gulp because all my compiler using gulp.

dimaslanjaka avatar Nov 03 '21 13:11 dimaslanjaka

Now iam still using local tsc compiler to produce production js files. so it takes more time

dimaslanjaka avatar Nov 03 '21 13:11 dimaslanjaka

Hi,

Have you known why since ?

I've tried using gulp.src(["src/**/*.{js,ts,json}"])

This doesn't work either ? because it should, as it only loads the files and do nothing else. I'll look into this asap.

haoadoreorange avatar Nov 30 '21 00:11 haoadoreorange

Hi,

Have you known why since ?

1 month ago

dimaslanjaka avatar Nov 30 '21 00:11 dimaslanjaka

Now i copying json files manually with

gulp.src(['src/**/*.json']).pipe(gulp.dest('dist'))

And compiling typescript with gulp-typescript separately. This trick work for now.

dimaslanjaka avatar Nov 30 '21 01:11 dimaslanjaka

Probably the issue is in compiler.ts then, here you can see that we don't push the json files to any output stream: https://github.com/ivogabe/gulp-typescript/blob/b01326a77347520f1a24a877e3305ae272a1b432/lib/compiler.ts#L154-L174

ivogabe avatar Nov 30 '21 21:11 ivogabe

Thanks for the hint ! Just tested, that's indeed where the problem is.

@dimaslanjaka Can you please revisit what is the behaviour of tsc regarding non js/ts files ?

It this is to be solved, I want to follow tsc's Api.

haoadoreorange avatar Nov 30 '21 22:11 haoadoreorange

Thanks for the hint ! Just tested, that's indeed where the problem is.

@dimaslanjaka Can you please revisit what is the behaviour of tsc regarding non js/ts files ?

It this is to be solved, I want to follow tsc's Api.

Sorry i dont understand what u mean.

try test with:

tsconfig.json

{
  "compilerOptions": {
    "allowJs": true,
    "checkJs": false,
    "allowUnusedLabels": true,
    "allowSyntheticDefaultImports": true,
    "allowUmdGlobalAccess": true,
    "allowUnreachableCode": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "declaration": true,
    "declarationMap": false,
    "declarationDir": "dist/types",
    "outDir": "dist"
  },
  "include": ["src", "__test__"],
  "exclude": ["src/lang"]
}

src/index.ts

import data from './data.json';
console.log(data);

src/data.json

["data1", "data2"]

gulpfile.ts

import ts from "gulp-typescript";
import gulp from "gulp";
function compileTs(done) {
  const tsProject = ts.createProject("tsconfig.json");
  const tsResult = tsProject.src().pipe(tsProject());

  return merge([tsResult.dts.pipe(gulp.dest("dist")), tsResult.js.pipe(gulp.dest("dist"))]);
}

exports.default = defaultTask;

on terminal execute

gulp

Test Cases

is src/data.json copied into dist/src/data.json or not ?

dimaslanjaka avatar Dec 03 '21 11:12 dimaslanjaka

is src/data.json is copied into dist/src/data.json or not ?

i tried this 1 month ago, json files not copied into destination tsconfig.json. and the program cannot run because json file not found in compiled directory (dist)

dimaslanjaka avatar Dec 03 '21 11:12 dimaslanjaka

Sorry i dont understand what u mean.

Does tsc treat all type of non JS/TS files import the same way ?

haoadoreorange avatar Dec 03 '21 14:12 haoadoreorange

Sorry i dont understand what u mean.

Does tsc treat all type of non JS/TS files import the same way ?

tsc copying only the json files because of resolveJsonModule: true on tsconfig.json

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka

I only need the json data that can be imported on js/ts

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka

rather than i modifying the ts variable, i prefer add/remove data on json files.

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka

the problem of this issue is gulp-typescript not copying json files into destination directory. If I use tsc in the shell, the json file will be copied to the destination folder.

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka

so, iam using this for now.

Now i copying json files manually with

gulp.src(['src/**/*.json']).pipe(gulp.dest('dist'))

And compiling typescript with gulp-typescript separately. This trick work for now.

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka

data in JSON is also useful for specifying an interface or type. for example https://github.com/dimaslanjaka/hexo-seo/blob/compiler/src/html/schema/article/index.ts

dimaslanjaka avatar Dec 03 '21 17:12 dimaslanjaka