NPM: There are no valid TypeScript file rules specified

Currently working on a small project using React.JS. Whenever I execute : npm run start, the following message gets logged:

Starting type checking and linting service...
Using 1 worker with 2048MB memory limit
Watching: /Users/John/Projects/myProject/src
Starting the development server...

ts-loader: Using <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="27535e57425444554e57536715091e0915">[email protected]</a> and /Users/John/Projects/myProject/tsconfig.json

No valid rules have been specified for TypeScript files

Compiled successfully!
You can now view book-viewer-test in the browser.
Local:            http://localhost:3000/

The highlighted line indicates the error. While everything seems to be functioning fine at the moment, there's concern about potential issues as the project grows in size and complexity.

Can someone help identify this Warning/Error and provide suggestions for resolution?

Below is the content of my tsconfig.json file:

{
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "build/dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es7", "dom"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "experimentalDecorators": true
  },
  "exclude": [
    "node_modules",
    "build",
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts"
  ]
}

And here is the content of tslint.json file:

{
  "jsRules": {
    "no-empty": true
  }
}

Your advice and help are greatly appreciated.

javascriptjsonreactjstypescriptnpm

Answer №1

Make sure to apply your TSLint rules to JavaScript files only, as they do not work on TypeScript files. For linting TypeScript files, remember to use the rules property instead of jsRules.

{
  "rules": {
    "no-empty": true
  }
}

Answer №2

If you want to ensure everything is running smoothly, it's a good idea to check the versions you're using. It doesn't seem like there are any major issues since no rules have been defined yet! Just make sure your react, npm, and node are updated for optimal performance. Your output should look something like this:

PS C:\React\my-app> npm run start

> <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="69041044081919295947584759">[email protected]</a> start C:\React\my-app
> react-scripts start
Starting the development server...
Compiled successfully!

You can now view my-app in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://192.168.1.67:3000/

Please note that the development build is not optimized.
To create a production build, use npm run build.

Answer №3

It seems like there may be an issue with TSLint in this scenario. Have you made sure that TSLint is properly installed? Could you provide us with a peek at your package.json? Additionally, do you have a tslint.json file available for inspection? If not, creating one with the desired rules could potentially resolve the problem.

Answer №4

The recommended resolution is to include the following code snippet in your project's tslint.json file:

{
    "rules": {
        "no-empty": false
    },
    "jsRules": {
        "no-empty": true
    }
}

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

"Encountering an issue with AJAX file upload displaying an error message for

Before I showcase my code, allow me to explain my objective. My goal is to create a page that updates a user's details in the database using AJAX. Initially, I successfully achieved this task. Subsequently, I wanted to enhance the functionality by inc ...

javascriptphpjqueryajaxupload

How to verify if both MySQL queries in Node.js have fetched results and then display the page content

Seeking assistance with two queries: one to verify user following post author and another to check if the user has liked the post. I attempted to use the logic: if ((likes) && (resault)), but it's not yielding the desired outcome. After inve ...

javascriptmysqlnode.js

Steps to resolve the Angular observable error

I am trying to remove the currently logged-in user using a filter method, but I encountered an error: Type 'Subscription' is missing the following properties from type 'Observable[]>': _isScalar, source, operator, lift, and 6 more ...

javascriptangulartypescript

I am attempting to load the ajax content into separate divs simultaneously

When I attempt to load the ajax into two separate divs, I notice that despite calling for data to be placed in two different divs within the ajax code, it all ends up in one div. <script>$(document).ready(function(){ $.ajax({ url: "http: ...

javascriptjqueryhtmlajax

Capacitor implementation of NextJS Server-Side Rendering

We are currently using Next.js with server-side rendering (SSR) and we are looking to integrate Capacitor.js into our app in order to make it compatible with both Android and iOS devices. However, it seems that this integration is only possible with static ...

reactjsreact-nativeionic-frameworknext.jscapacitor

When using a try-catch block to validate an object, why does the Liskov Substitution Principle (LSP) fail to correctly

function parseAndValidate(obj: unknown): ParsedObj | void { try { // conducting various validations return parsedObj } catch { throw new Error('obj is invalid') } } const parsedObj = parseAndValidate(obj) I ...

typescriptlanguage-server-protocol

Mismatch between generic types

When working with this code, I encounter a syntax error at m1 and m2. The error message states: Type 'T' is not assignable to Type 'boolean' or Type 'T' is not assignable to Type 'string' interface customMethod { ...

typescript

What is the process for sorting Google Map markers with AngularJS?

.controller('MapCtrl', ['$scope', '$http', '$location', '$window', '$filter', '$ionicLoading', '$compile','$timeout','$ionicPopup', function ...

javascriptangularjsgoogle-mapsgoogle-maps-api-3google-maps-markers

Tips for transferring a jQuery array to PHP

I am encountering an issue when trying to send a jQuery array to PHP. Initially, I have one form in HTML and upon clicking 'add', I end up with two forms. Afterwards, I input data into the form which is then stored in a jQuery array. However, I a ...

javascriptphpjqueryhtmlajax

Designing a MongoDB document structure that includes subdocuments with similar properties

Currently, I am in the process of developing a referral feature and I am relatively new to MongoDB. My main issue lies in figuring out how to construct a document that contains multiple similar subdocuments - specifically, 4 email addresses. The challenge ...

javascriptnode.jsmongodbnpmmongoose

Instructions for inserting an anchor tag into the middle of a <p> element utilizing document.createElement("p")

When generating elements dynamically with JavaScript using document.createElement("p"), I am looking to create a paragraph element <p></p> that includes an anchor tag in the middle, creating a clickable link within the text. I aim to use JavaS ...

javascripthtml

troubles with compatibility between bootstrap.css and IE11

I am currently developing a web application using AngularJS and bootstrap.css. While everything appears fine on Chrome, I am facing some formatting issues on both Firefox and IE11. HEAD <head> <meta charset="utf-8"> <meta http-equi ...

javascriptangularjshtmltwitter-bootstrap-3

Generating variable names dynamically in JavaScript

To prevent a javascript heap issue, I implement the usage of multiple arrays including 'family1', 'family2','family3' and 'dogs1', 'dogs2', 'dogs3'. For instance, you can use 'family1 and dog ...

javascriptarraysvariablesnaming

Transferring onFocus in a React component

Is there a way to hide the yellow title when focusing on an input field? I'm having trouble passing it from the component to use it in the index page. You can view my code at this link. ...

reactjsnext.jscomponents

I am attempting to access and display the properties of a higher-level component within a nested component

Trying to access the props passed to my parent component using this.state.props in my child component. Searching high and low on the internet for a solution. Choose(){ console.log(this.props.size); } {this.props.size && <DropdownIte ...

reactjsstatereact-props

Transform the HTTP text response into a pandas dataframe

Is there a way to utilize Python Pandas' pre-built or in-built parser to convert the text below into a pandas dataframe? Although I can create a custom parsing function, I am interested in finding out if there is a faster and ready-made solution avail ...

pythonjsonpandasparsing

My ng new project is experiencing some issues as it seems to be stuck at "CREATE project/src/app/app.component.css (0 bytes)". Can someone help

As of yesterday, my angular projects were running smoothly. However, starting today, I am facing a persistent issue where the project gets stuck without any error messages. Here is a snapshot of my terminal when the project gets stuck: C:&b ...

angularnpm

What indicators should we look for to decide if JavaScriptExecutor is needed in a Selenium C# project?

Encountering an exception with TestInChrome1 - "OpenQA.Selenium.ElementNotInteractableException: element not interactable". On the other hand, using JavaScriptExecutor in TestInChrome2 resolves the issue. Some key questions arise: What is causing the ...

javascriptc#seleniumselenium-webdriverpage-title

Is there a way to switch out the navigation icons on the react-material-ui datepicker?

Can the navigation icons on the react-material-ui datepicker be customized? I've attempted various solutions without any success. <button class="MuiButtonBase-root MuiIconButton-root MuiPickersCalendarHeader-iconButton" tabindex="0&q ...

cssreactjsmaterial-ui

Is it possible to integrate Material Icons with a PrimeReact button?

At the moment, I am utilizing Button from PrimeReact. They utilize icons from PrimeIcons which have a limited number of options. However, I would like to incorporate Material Icons into my buttons. <Button label='View/Edit Job' icon="pi p ...

reactjsmaterial-uiprimereact