Unexpected token { in Fuse-Box when using Typescript

Here's the beginning of my fuse.ts file

import { CSSPluginOptions } from 'fuse-box/plugins/stylesheet/CSSplugin';
import { argv } from 'yargs';
import * as path from 'path';
import {
    CSSPlugin, CSSResourcePlugin, EnvPlugin, FuseBox, QuantumPlugin, 
    SassPlugin, Sparky, WebIndexPlugin, CopyPlugin, CSSModules
} from 'fuse-box';
import { SparkyFile } from 'fuse-box/sparky/SparkyFile';
import * as fs from 'fs';
const express = require('express');

class SparkyContext
{

I encountered this error message

import { argv } from 'yargs';

^

SyntaxError: Unexpected token {

Initially, the first import statement works fine but then there's an issue with the second one. I tried rearranging some imports and found that most of them yield the same error indicating either * or { is unexpected after the import.

Below is my basic and standard tsconfig.json configuration:

{
  "compilerOptions": {
    "baseUrl": "./src",
    "jsx": "react",
    "target": "es5",
    "module": "es2015",
    "sourceMap": true,
    "importHelpers": false,
    "removeComments": true,
    "moduleResolution": "node",
    "lib": ["es2015", "es2015.iterable", "dom"],
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports" : true
  }
} 

I'm unsure about the root cause of this issue and where to begin troubleshooting. Interestingly, if I change the statements to require syntax, it does work. It seems like there might be a conflict with the tsconfig.json file. I have checked for any conflicting properties in package.json or other files, but nothing stands out.

Answer №1

Using the command ts-node -F -O '{\"module\": \"commonjs\"}' ./fuse.ts serve proved to be effective.

It's interesting that specifying compiler options was necessary in this case. It could be due to a global installation of ts-node not recognizing my tsconfig.json file in the project.

I will conduct further research and provide updates as needed, but for now, this workaround has enabled me to progress with the task at hand :)

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

retrieve data from the API response using a node request

I initiated an API request using the request method. Everything seems to be functioning properly, but I am encountering difficulty extracting the results from the response. The snippet of my code in question is as follows: app.get('/events/:query&a ...

The battle of efficiency: Generating content from JSON files compared to pulling from a

Greetings, fellow forum members! This is my inaugural post here. Despite the title possibly hinting at duplication, I have come across similar posts such as: one, two, three, four, and so on. However, my query bears a slight variation. I am currently in th ...

How can JSON data objects be transmitted to the HTML side?

I created a JSON object using Node JS functions, and now I'm looking to transfer this data to the HTML side in order to generate a table with it. However, I'm encountering difficulties sending the JSON object over because of my limited experience ...

The conditional statements within the resize function may not always be triggered when the conditions are fulfilled

Struggling to trigger a function only once when resizing. The issue is that the conditional statements are not consistently executed every time. Here's the code snippet: var old_width = $(window).width(); $(window).on('resize.3col',functio ...

Tips on resolving issues with cellclickable functionality in Angular with gridster2

VERSION: ^9.3.3 HTML <button (click)="toggleEditing()">{ editing ? 'cancel' : 'editing' }</button> <button>ADD</button> <gridster [options]="options"> &l ...

The placeholder text is not displaying with bullets in Internet Explorer. However, it is functioning correctly in Chrome

I need assistance displaying the placeholder text in IE8 as shown below: "Any relevant reference numbers, such as Direct Debits: - Name of the Branch (if applicable) - What was the original problem - Date the problem occurred " While it appears correct ...

Repeated information displayed in modal pop-ups

HTML <a class="btn" data-popup-open="popup-1" href="#">More Details</a> <div class="popup" data-popup="popup-1"> <div class="popup-inner"> <h2>Unbelievable! Check this Out! (Popup #1)</h2> ...

Navigating the loading of information with fetch and React Hooks

As a newcomer to React and still learning JavaScript, I am facing a challenge with handling useEffect alongside an asynchronous function. My goal is to fetch data from an API and render a quote in the paragraph with id of text, along with the author's ...

Issue encountered where Moment locale functionality is working in local development environment, but not functioning properly in the

My application built with Next.js requires displaying the date in Bengali instead of English. The issue arises after running the build command 'build:next build' where the production version displays the date in English (e.g. '20 January, Su ...

reveal the concealed divs within the list elements

html: In my HTML document, I have a unordered list (ul) with each list item (li) constructed like this: <li class="A">list-item <div>1</div> <div class="B">2 <div class="C">3</div> </div> ...

Encountering an issue when attempting to establish a connection to Redis using a cache manager within a Nest

Incorporating the NestJS framework into my project and utilizing Cash Manager to connect with Redis cache. Successfully connected with Redis, however encountering an error when attempting to use methods like set/get which shows 'set is not a function& ...

Can you import folders containing *.vue files in your project?

Repeating code is my least favorite thing. Currently, I am importing vue files in a repetitive manner in my main.js file. import Default from '../../src/components/default.vue'; import Home from '../../src/components/home.vue&apo ...

What is the best way to test an AngularJS directive and monitor function calls with a spy?

After running the code below, an error is thrown mentioning that element.popover is not being invoked. I can't seem to identify what the problem is. Thank you in advance for any assistance provided. directive: angular.module('directives', ...

Encountering a Next.js prerendering issue when using getStaticPaths

I am currently developing a Next.js application. Here is the structure of my files: cpanearme -components -listitem.js -pages -home -index.js -firm -[id].js Below is the code for a list item that redirects to the dynamic rout ...

I need some guidance on how to implement redirectLocation in react-router and properly handle the 301 or 302 status

We are currently in the process of deploying our website using reactjs and we have made a change where we removed a specific URL /[product]/menu and merged it into our main page /[product]. Now, we have been instructed to set up a 301 redirect for /[produc ...

Delay the occurrence of a hover effect until the previous effect has finished executing

As I hover over an element, the desired animation is displayed while hiding other elements on the page. The challenge I'm encountering is that if I quickly hover over many divs, the animations queue up and hide the divs sequentially. I want only one ...

"Exploring the versatility of NextJS with dynamic route parameters

Can NextJS be configured to handle dynamic routes that match both /country and /country/city, while excluding matches like /country/city/whatever_content_here? The goal is to display the same content for either of the specified routes, regardless of whethe ...

Commitment failing to deliver the information

I am currently attempting to retrieve data based on a specific ObjectId using promises. The function is successfully fetching the data from the database, but it is failing to return the result as expected. Below is the code snippet: getScreenDetails = fun ...

Issue with Website Rendering: Safari 4 exhibits display glitch showing temporary content before showing a blank white screen

Currently, I'm in the process of developing a specialized rails application. However, there seems to be an unusual rendering error that has been reported by Safari 4 users. It's quite peculiar because the page appears briefly but quickly disappea ...

Arrange images with haphazard placement

Can someone guide me on creating a block of images when working with an array of random items? https://i.sstatic.net/qEcQy.png ...