Skip to content

Commit a342910

Browse files
committed
Add some notes about using TypeScript and ES6
1 parent 21edfbf commit a342910

File tree

1 file changed

+28
-0
lines changed

1 file changed

+28
-0
lines changed

README.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -267,6 +267,34 @@ application.register('autocomplete', Autocomplete)
267267
export { app };
268268
```
269269

270+
## Writing TypeScript controllers
271+
272+
If you want to write TypeScript controllers, make sure the target of your TypeScript config is set to `ES6`:
273+
274+
```json
275+
{
276+
"compilerOptions": {
277+
//...
278+
"target": "ES6",
279+
},
280+
//...
281+
}
282+
```
283+
284+
If you don't you may face the following issue in your browser console when the controller is called:
285+
286+
```
287+
# Error thrown in Chrome console:
288+
Uncaught (in promise) TypeError: Class constructor Controller cannot be invoked without 'new'
289+
290+
# Error thrown in Firefox console:
291+
Uncaught (in promise) TypeError: class constructors must be invoked with 'new'
292+
```
293+
294+
The error is caused when an ES5 class tries to "extend" an ES6 class. If the target is not correctly set,
295+
TypeScript would transpiling the controller to old ES5 code. But Stimulus 3 uses pure ES6 classes.
296+
This causes an incompatibility, hence the need to target ES6 explicitly.
297+
270298
## Run tests
271299

272300
```sh

0 commit comments

Comments
 (0)