Not produce json module to destination directory ?

[dimaslanjaka]

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

Compiled

[haoadoreorange]

@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 ?

[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).

[dimaslanjaka]

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]

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

[haoadoreorange]

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.

[dimaslanjaka]

Hi,

Have you known why since ?

1 month ago

[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.

[ivogabe]

Probably the issue is in compiler.ts then, here you can see that we don't push the json files to any output stream:

gulp-typescript/lib/compiler.ts

Lines 154 to 174 in b01326a

	private attachContentToFile(file: OutputFile, fileName: string, content: string) {
	const [, extension] = utils.splitExtension(fileName, ['d.ts', 'd.ts.map']);
	switch (extension) {
	case 'js':
	case 'jsx':
	file.jsFileName = fileName;
	file.jsContent = content;
	break;
	case 'd.ts.map':
	file.dtsMapFileName = fileName;
	file.dtsMapContent = content;
	break;
	case 'd.ts':
	file.dtsFileName = fileName;
	file.dtsContent = content;
	break;
	case 'map':
	file.jsMapContent = content;
	break;
	}
	}

[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.

[dimaslanjaka]

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]

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)

[haoadoreorange]

Sorry i dont understand what u mean.

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

[dimaslanjaka]

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]

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

[dimaslanjaka]

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

[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]

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]

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