Fixing issue with TypeScript 2.9 resolveJsonModule error in transpiled documents

Using TypeScript 2.9's resolveJsonModule feature has been successful when running the application with ts-node. However, upon transpiling the source files into the outdir, it also copies the JSON files into the outdir and includes a source map link to the type files within them, similar to this structure:

[
    {
        "scid": 59000000
    },
    {
        "scid": 59000000
    }

]
//# sourceMappingURL=roles.json.map

Upon running the transpiled javascript files, attempts to parse these JSON files result in SyntaxErrors due to an unexpected token pointing to the comment line:

internal/modules/cjs/loader.js:724
    throw err;
    ^
    
SyntaxError: C:\Users\user\Documents\project\lib\assets\filename.json: Unexpected token / in JSON at position 22186
    at JSON.parse (<anonymous>)

Post-transpilation project root structure:

  • assets
  • lib
    • assets
    • json-file.d.ts
    • json-file.json
    • src
      • all transpiled js files and their d.ts files
  • src
    • all TypeScript source files tsconfig.json

Question:

Is there a way to utilize TypeScript 2.9's resolveJsonModule feature so that the transpiled JavaScript can successfully parse the JSON files (currently failing due to the comment line)?

Edit:

Attempts to exclude the assets folder from tsconfig.json's exclude property have proven ineffective. The full content of tsconfig.json can be found here:

Answer №1

After some investigation, I discovered that there was a bug in the code which has since been corrected with TypeScript version 2.9.2. The previous versions, 2.9.0 and 2.9.1, introduced source maps to the transpiled JSON files.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to incorporate node modules into my tsconfig file?

I've taken some raw angular typescript components and packaged them into a private NPM module for sharing between various projects. Although I import these components like any other npm library, I encounter an error message when trying to serve my ap ...

What are the steps for creating a custom JSON parser using a provided JSON file?

My task involves generating a customized json parser from a given json file. The structure of the provided json is as follows: { "id": "Z3PvTW", "title": "TESTING", "theme": { ... }, ... } ... In order to achieve this, I i ...

Is it essential for Mantle to have a fully specified Model?

Currently, I am working with JSON data that is constantly changing. Recently, I began implementing Mantle to parse this JSON, as it appeared to be a suitable solution for my needs. However, I encountered an issue where if the JSON contains properties that ...

Error encountered when attempting to retrieve response from Java Servlet using HttpClient

I'm encountering an issue where I am receiving a null response in Angular when attempting to post to a httpservlet (Java) in a WebSphere Application Server environment. The objective is to call an API for logging in. However, I am getting a null resp ...

Master the art of properly switching on reducer-style payloads in Typescript

Currently, I am dealing with two types of data: GenArtWorkerMsg and VehicleWorkerMsg. Despite having a unique type property on the payload, my Searcher is unable to differentiate between these data-sets when passed in. How can I make it understand and dis ...

"Exploring the dynamic duo of Angular2 and ng2Material

I am currently facing an issue with the styling in my code while using ng2Material with Angular2. First: A demonstration of Material style functioning properly can be seen in this plunker. When you click on the button, you will notice an animation effect. ...

Receiving a 422 Status Code when attempting a Volley Post request with JSON

I'm currently utilizing Volley to send a JSON object to a Loopback application API connected to MongoDB. Although the data gets saved in the database successfully, the Volley response consistently indicates a status code of 422. Can anyone pinpoint wh ...

Is there a way to utilize useTranslate as a utility function rather than a component?

Currently utilizing Next.js and exploring text translation using the 'next-translate/useTranslation' feature. To ensure only translated strings are displayed, I have implemented a function that checks if the string exists in my translation JSON ...

Unable to set dimensions for an image within an input field using TypeScript

My goal is to retrieve and assign the height and width of an image to hidden text inputs in HTML, as shown below: The purpose is to obtain the height and width for validation. HTML: <input type="file" class="file" #introIcon id="uploadBtn" (change)=" ...

Using Angular and Typescript to implement mathematical formulas involving date object subtraction

I need help converting the following Excel formula to Typescript. I keep running into an error that says 'The left-hand and right-hand side of an arithmetic operation must be of type 'any', 'number' or an enum type'. Can anyon ...

Using JSON data in an ArrayBuffer with TypeScript

I am currently struggling with converting the received ArrayBuffer data from a server via Websocket into another format. Below is the WebSocket code snippet: let ws = new WebSocket('wss://api.example.com/websocket'); ws.binaryType = 'arrayb ...

Is there a way to automatically set all object properties to false if one property is set to true in React?

The Issue: My task at work involves creating 3 buttons with separate filters to display different tickets in a table. All the functionality is completed, and the filtered tickets are displayed correctly. However, I am facing an issue that is preventing m ...

Why am I receiving the error message "Argument of type 'number' is not assignable to parameter of type 'never'?"

import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { showSecret = false; logArr ...

Utilize JSON data loading instead of directly embedding it onto the page for improved website

I've integrated Mention.js into my website, allowing a dropdown list of usernames to appear when "@" is typed in a designated textarea. <textarea id="full"></textarea> While it's functioning well, the examples provided only show how ...

Accessing JSON data on Android through HTTPS connections

I am struggling with parsing JSON from the Facebook Graph API. Whenever I try to access the JSON by using this URL: https://graph.facebook.com/interstacjapl/feed?access_token=MyTOKEN, it doesn't work. But if I manually copy the JSON data (which wo ...

Tips for sending data through an API in an AngularJS application within an Ionic framework

Being new to this field, I require some assistance. I need to send data to an API, but I am struggling with the process. Can someone please guide me on how to do this? The API link is: Below is the JSON format in which the data needs to be sent: { "er ...

Enabling CORS header 'Access-Control-Allow-Origin' in Angular 2 using Typescript

I am currently developing an Angular 2 typescript application on my localhost. I recently encountered an issue when trying to access an external REST API in my application, resulting in the following error message: Cross-Origin Request Blocked: The Same ...

Tips for saving an array of objects in local storage and transferring it from one file to another

Recently delving into the world of localstorage, I've encountered an issue while attempting to store JSON data in one file and retrieve it in another. The JSON data below was fetched from a URL, and my goal is to obtain all the feed objects in the oth ...

Accessing the Next.js API after a hash symbol in the request URL

Is there a way to extract query strings from a GET request URL that contains the parameters after a '#' symbol (which is out of my control)? For example: http://...onnect/endpoint/#var_name=var_value... Even though request.url does not display a ...

Transformation of JSON data into a structured dataframe

Investigating club participation by analyzing data retrieved as JSON through a URL request. The JSON obtained and loaded using json_loads is presented below: df = [{"club_id":"1234", "sum_totalparticipation":227, "level&q ...