'Getting typescript errors while deploying the node app to heroku
I have been trying to deploy my typescript based node server to heroku but getting the following error while deployment
-----> Build
Running build
> [email protected] build
> rimraf dist && tsc
src/services/notification/notification.service.ts(46,37): error TS2322: Type 'string | ObjectId' is not assignable to type 'Condition<string>'.
Type 'ObjectId' is not assignable to type 'Condition<string>'.
src/services/report/report.service.ts(53,35): error TS2769: No overload matches this call.
Overload 1 of 3, '(callback?: Callback<ReportType[]>): Query<ReportType[], ReportType, {}, ReportType>', gave the following error.
Argument of type '{ _id?: string; admin: string | Types.ObjectId; status?: string; containsDublicates?: boolean; stickers?: [Types.ObjectId]; }' is not assignable to parameter of type 'Callback<ReportType[]>'.
Type '{ _id?: string; admin: string | ObjectId; status?: string; containsDublicates?: boolean; stickers?: [ObjectId]; }' provides no match for the signature '(error: NativeError, result: ReportType[]): void'.
Overload 2 of 3, '(filter: FilterQuery<ReportType>, callback?: Callback<ReportType[]>): Query<ReportType[], ReportType, {}, ReportType>', gave the following error.
Argument of type '{ _id?: string; admin: string | Types.ObjectId; status?: string; containsDublicates?: boolean; stickers?: [Types.ObjectId]; }' is not assignable to parameter of type 'FilterQuery<ReportType>'.
Type '{ _id?: string; admin: string | Types.ObjectId; status?: string; containsDublicates?: boolean; stickers?: [Types.ObjectId]; }' is not assignable to type '{ _id?: any; admin?: Condition<string>; status?: Condition<string>; containsDublicates?: Condition<boolean>; stickers?: Condition<[ObjectId]>; ... 55 more ...; validateSync?: Condition<...>; }'.
Types of property 'admin' are incompatible.
Type 'string | ObjectId' is not assignable to type 'Condition<string>'.
Type 'ObjectId' is not assignable to type 'Condition<string>'.
Overload 3 of 3, '(filter: FilterQuery<ReportType>, projection?: any, options?: QueryOptions, callback?: Callback<ReportType[]>): Query<...>', gave the following error.
Argument of type '{ _id?: string; admin: string | Types.ObjectId; status?: string; containsDublicates?: boolean; stickers?: [Types.ObjectId]; }' is not assignable to parameter of type 'FilterQuery<ReportType>'.
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
If you're stuck, please submit a ticket so we can help:
https://help.heroku.com/
Love,
Heroku
! Push rejected, failed to compile Node.js app.
! Push failed
the project is running smoothly without any error locally, getting this on heroku only
Solution 1:[1]
Actually ts was checking the query response from mongodb, which was ignored in other functions but not these.
So I just added //@ts-ignore before the line 53 and 46 to ingore just like other query functions
Solution 2:[2]
There are some errors in your HTML. I would suggest associating the id's to your inputs instead of at the beginning.
<html>
<body>
Hi! What is your name? <input id= "userName" type="text"</input> <br>
How many hours have you worked this week? <input id="hoursWorked" type="text"</input><br>
<button onclick="calculator()">Calculate</button>
<p id="HTMLinput"></p>
<script type="text/javascript">
function calculator(){
var hoursWorked = document.getElementById("hoursWorked").value;
var userName = document.getElementById("userName").value;
document.getElementById("HTMLinput").innerHTML = userName + " worked " + hoursWorked + " hour(s).";
var pay = "$" + (hoursWorked * 15);
var hoursLeft = (40 - hoursWorked); //This equation determines how many hours of work the user has left to complete
if (hoursLeft < 0){
alert ("Uh oh! " + userName + "! That's too many hours!")}; //If the user enters an amount of hours that is over 40 they will recieve an error message
if (hoursLeft === 0){
alert ("Congratulations, " + userName + "! You have completed all 40 hours of work!"); //If the user has completed 40 hours of work they will be given this message
alert ( userName + ", your pay will be: " + pay)};
if (hoursLeft > 40){
alert (userName + "! That is not possible!")}; //If the user enters an amount larger than 40 they will get this error, since that is not possible
if (hoursLeft >= 1 && hoursLeft <= 39 ){
alert (userName + "! You have " + hoursLeft + " more hours to work.") //If the user enters a normal amount of hours (1-39) then they will get this message
alert ( userName + ", your pay so far will be: " + pay)};
if (hoursLeft === 40){
alert (userName + "! You haven't worked any hours this week! Your pay so far is zero.");}
}
</script>
</body>
</html>
Solution 3:[3]
You mentioned prompt in your comment, so here's a version of this using prompts (Probably not what you were looking for, but a teaching moment nonetheless).
document.addEventListener('DOMContentLoaded', calculator);
function calculator() {
let userName = prompt('Hi! What is your name?');
let hoursWorked = prompt('How many hours have you worked this week?');
var pay = ("$" + hoursWorked * 15)
var hoursLeft = (40 - hoursWorked); //This equation determines how many hours of work the user has left to complete
if (hoursLeft < 0) {
alert("Uh oh! " + userName + "! That's too many hours!")
}; //If the user enters an amount of hours that is over 40 they will recieve an error message
if (hoursLeft === 0) {
alert("Congratulations, " + userName + "! You have completed all 40 hours of work!"); //If the user has completed 40 hours of work they will be given this message
alert(userName + ", your pay will be: " + pay)
};
if (hoursLeft > 40) {
alert(userName + "! That is not possible!")
}; //If the user enters an amount larger than 40 they will get this error, since that is not possible
if (hoursLeft >= 1 && hoursLeft <= 39) {
alert(userName + "! You have " + hoursLeft + " more hours to work.") //If the user enters a normal amount of hours (1-39) then they will get this message
alert(userName + ", your pay so far will be: " + pay)
};
if (hoursLeft === 40) {
alert(userName + "! You haven't worked any hours this week! Your pay so far is zero.");
}
document.querySelector('#HTMLinput').innerHTML = "<button onclick='calculator()'>Try again</button>";
}<p id="HTMLinput"></p>Solution 4:[4]
First of all, the whole html syntax you wrote does not exists in html5. input tags have no closing tag. More into the correction, the id's for elements must be inside a proper html tag, in your case, you need to add them into the input tags. Like so, the resulting code would be something like this:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<p>Hi! What is your name?</p><input type="text" id="userName">
<p>How many hours have you worked this week?</p><input type="text" id="hoursWorked">
<button onclick="calculator()">Calculate</button>
<p id="HTMLinput"></p>
<script type="text/javascript">
function calculator(){
var hoursWorked = document.getElementById("hoursWorked").value;
var userName = document.getElementById("userName").value;
document.getElementById("HTMLinput").innerHTML = `${userName} ${hoursWorked}`
//The rest of your code
var pay = ("$" + hoursWorked * 15)
var hoursLeft = (40 - hoursWorked);
if (hoursLeft < 0) {
alert("Uh oh! " + userName + "! That's too many hours!")
};
if (hoursLeft === 0) {
alert("Congratulations, " + userName + "! You have completed all 40 hours of work!"); //If the user has completed 40 hours of work they will be given this message
alert(userName + ", your pay will be: " + pay)
};
if (hoursLeft > 40) {
alert(userName + "! That is not possible!")
}; //If the user enters an amount larger than 40 they will get this error, since that is not possible
if (hoursLeft >= 1 && hoursLeft <= 39) {
alert(userName + "! You have " + hoursLeft + " more hours to work.") //If the user enters a normal amount of hours (1-39) then they will get this message
alert(userName + ", your pay so far will be: " + pay)
};
if (hoursLeft === 40) {
alert(userName + "! You haven't worked any hours this week! Your pay so far is zero.");
}
}
</script>
</body>
</html>
The JS its almost perfect. Try to not abuse of if staments and use structures such us switch case. And also, for helping others to check your code, try to format the code. if you don't have a linter in your code editor, you can use online tools such us beautifier.io. Hope this helps you :D
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Wahas Ali Mughal |
| Solution 2 | luckeycharms13 |
| Solution 3 | Kinglish |
| Solution 4 | migtarx |