What is the correct way to define global variable in ES6 modules?

There are several ways to have global values available in your application. Using ES6 modules, you can create a constant which you export from your module. You can then import this from any other module or component, like so: /* Constants.js */ export default { VALUE_1: 123, VALUE_2: “abc” }; /* OtherModule.js */ import Constants … Read more

Property ‘value’ does not exist on type ‘never’. when use useRef hook in mui

useRef is generic if you use it with TypeScript, so you can define the referenced element type like const ref = useRef<Type>(); Looking into the type definitions for the inputRef property in MaterialUI it states: /** * Pass a ref to the `input` element. */ inputRef?: React.Ref<any>; So for a fix you can define your … Read more

Detect last iteration in FOR OF loop in ES6 javascript

One approach is using Array.prototype.entries(): for (const [i, value] of arr.entries()) { if (i === arr.length – 1) { // do your thing } } Another way is keeping a count outside the loop like Shidersz suggested. I don’t think you want to check indexOf(item) though because that poses a problem if the last item … Read more

Number formatting in template strings (Javascript – ES6)

No, ES6 does not introduce any new number formatting functions, you will have to live with the existing .toExponential(fractionDigits), .toFixed(fractionDigits), .toPrecision(precision), .toString([radix]) and toLocaleString(…) (which has been updated to optionally support the ECMA-402 Standard, though). Template strings have nothing to do with number formatting, they just desugar to a function call (if tagged) or string … Read more

What causes NextJS Warning: “Extra attributes from the server: data-new-gr-c-s-check-loaded… “

This is usually caused by an extension passing these extra attributes with your code when it is executed on the browser trying to interact with the UI, this creates a mismatch between what was rendered on the server and what is rendered on the client. Extensions similar to Grammarly, ColorZilla and LanguageTool are therefore the … Read more

Cannot import exported interface – export not found

The root cause is in Typescript and transpilation. Once TypeScript code is transpiled, interfaces/types are gone. They don’t exist anymore in the emitted files. While the types are erased, the imports/exports aren’t necessarily. The reason is that there are ambiguities and that the compiler doesn’t always know for sure whether something that is exported is … Read more