Material-components-web-components: Why write these components with Ts and SCSS instead of Plain Js and CSS in Developing without a Build style ?

[CICCIOSGAMINO]

* PLEASE READ THIS BEFORE FILING AN ISSUE *

I'm submitting a:

• [ ] bug report
• [ ] feature request

What OS are you using?

What browser(s) is this bug affecting:

Current behavior:

Expected behavior:

Steps to reproduce:

Related code:

// insert any relevant code here or add a include a codepen

Other information:

[aomarks]

We use TypeScript because TypeScript adds types to JavaScript.

Types help make code less error-prone, because they allow the compiler to detect many common errors, such as passing the wrong kind of object to a function, or forgetting to check that an object could be undefined before accessing it. When a project gets to a certain size and complexity, and is being written by many different people, then these kinds of checks become extremely valuable.

Types are also helpful for reading and writing code, because they allow your editor (e.g. VSCode) to provide additional information about the code (e.g. hover your mouse on a variable to see what type it is, or click on a function to see where that function is called), and to suggest auto-completions (e.g. if you type input.ch, then your editor can suggest that you might want to complete to input.checked).

Note that you can view the published JavaScript generated from our TypeScript code using unpkg (for example https://unpkg.com/browse/@material/mwc-button/mwc-button-base.js). The TypeScript and generated JavaScript will look very similar, except that the JavaScript doesn't have type annotations, and decorators (which we make use of, another feature we like about TypeScript) are converted into a plain JavaScript equivalent.

We primarily use SASS because this library is based on the MDC Web library, so we inherited that system. The MDC Web library uses SASS because SASS adds a lot of useful features to CSS, such as build-time variables and functions. For large, complex code-bases of CSS, these features can be very helpful for productivity.

Whether we continue to use SASS for the Material Web Components in the longer-term remains to be seen. One advantage of Custom Elements is that, because your styles are scoped to individual components, it is usually possible to write much simpler CSS than used to be required for applications with traditional globally-scoped styles. That might mean tools like SASS are of slightly less value.

Hope that answers your question, closing this issue.

[CICCIOSGAMINO]

Yep, thanks