Minimalistic configuration for TS to only extend JS with types. No TS features, no bundling. Readable maintainable code after compilation.

Overview

ts-guideline

Minimalistic configuration for TS to only extend JS with types. No TS-scpecific features, no bundling. Readable maintainable code after compilation.

  • commonjs folder for CommonJS Modules ts-configuration compatible with ECMAScript import

  • ecmascript folder for ECMAScript Modules ts-configuration

  • js-dts folder for JS + DTS configuration

  • js-doc folder for JS Doc + TypeScript configuration

Reccomendations

  1. Avoid using type aliases - example from mongoose types

    export type ApplyBasicQueryCasting<T> = T | T[] | (T extends (infer U)[] ? U : any) | any;

    this is unreadable and overcomplicated

    Aliases are good only for simple types

    type Fruit = 'banana' | 'orange' | 'pineapple' | 'watermelon';
    
    type Debt = { amount: number; dueTo: Date };
    type AccountDebt = { accountId: number; debt: Debt | null };
  2. Never use complicated generic types - example from mongoose types

    type QueryWithHelpers<ResultType, DocType, THelpers = {}, RawDocType = DocType> = Query<
      ResultType,
      DocType,
      THelpers,
      RawDocType
    > &
      THelpers;

    basically is is looks worse then

    type QueryWithHelpers<any> = Query<any> & any;
  3. Not everything is neccessary to cover with types.

    It requires to add useless interfaces for type like this. Better just not use this.

    // with typing
    interface IDynamicGeneratedClass {}
    
    const classGenerator = (): IDynamicGeneratedClass =>
      class DynamicGeneratedClass implements IDynamicGeneratedClass {
        args: number[];
        constructor(...args: number[]) {
          this.args = args;
        }
      };
    // simplified
    const classGenerator = () =>
      class DynamicGeneratedClass {
        args: number[];
        constructor(...args: number[]) {
          this.args = args;
        }
      };
  4. avoid using any - there is no point at all to use typescript if you need to keep using any.

This list will continue in future.

Alternatives

  1. You can use JS Doc @type for type definitions, typescript will work and check types for you

  2. You can always use JS + DTS - it is a similar way as it is done in C++ with .h and .cpp files DTS files are not working perfectly. Sometimes you forced to use JS Doc @typedef to import types from d.ts files

Summary

I prefer to use JS + DTS or JS DOC + TypeScript, because it solve every type issues, but not requires to write code in TypeScript

If it is not possible for you to follow this 2 solutions, please think about using those TS Guidelines. It will save you a lot of pain in future.

TypeScript will sync their development withing the JavaScript standard. This means there will be no TS Decorators and TypeScript will become more like JS Extension rather than a different language transpiled to JS.

Good talks about Types and JS/TS future

You might also like...

Boilerplate starter template for a new TON blockchain project - FunC contracts, JS tests, compilation and deployment scripts

TON Starter Template - Contracts Starter template for a new TON project - FunC contracts, JS tests, compilation and deployment scripts Overview This p

Dec 17, 2022

mini vite, support static server, load ts files, pre-bundling.

Mini Vite 中文 Features Same structure with Vite. Support JS, TS, JSX, TSX, CSS, static files. Support public as public directory. Dependency Pre-Bundli

Sep 15, 2022

A compilation of Google Tag Manager (GTM) adapters written for measuring interactions with embedded content.

Google Tag Manager (GTM) Custom HTML Adapters for Measuring Embedded Content Interactions This repository contains adapters for sending interaction da

Oct 3, 2022

A starter template that uses Phaser 3, TypeScript, Electron and Rollup and Vite for bundling.

A starter template that uses Phaser 3, TypeScript, Electron and Rollup and Vite for bundling.

Phaser TypeScript Electron starter template This is a 🕹️ Phaser 3 starter with ⌨️ TypeScript and ⚛️ Electron, 📦 Rollup and Vite. 🔥 🔥 HOT RELOAD ON

Nov 25, 2022

🧩 TypeScript utility type in order to ensure to return only properties (not methods) containing values in primitive types such as number or boolean (not Value Objects)

🧩 TypeScript utility type in order to ensure to return only properties (not methods) containing values in primitive types such as number or boolean (not Value Objects)

🧩 TypeScript Primitives type TypeScript utility type in order to ensure to return only properties (not methods) containing values in primitive types

Dec 7, 2022

基于React开发的新一代web调试工具,支持React组件调试,类似于Chrome Devtools。A Lightweight, Easy To Extend Web Debugging Tool Build With React

基于React开发的新一代web调试工具,支持React组件调试,类似于Chrome Devtools。A Lightweight, Easy To Extend Web Debugging Tool Build With React

English | 简体中文 基于React开发的移动web调试工具 更新日志 简单易用 功能全面 易扩展 高性能 使用cdn方式,一键接入 类Chrome devtools, 内嵌React开发者工具,支持日志,网络,元素,代理,存储,性能等, 具有更好的网络捕获能力和丰富的日志展现形式 暴露内部

Dec 25, 2022

📦 Alpine JS plugin to extend the functionality of the official $persist plugin

Alpine JS Persist Extended Alpine JS magic method $storage extends the official $persist plugin to help you work with local storage 📦 Example 👀 div

Dec 28, 2022

Avatar classes to extend Bootstrap 5.

Avatar classes to extend Bootstrap 5.

Bootstrap Avatar A collection of fixed and responsive CSS for styling avatars. Demo https://ghoststead.github.io/bootstrap-avatar Installation jsDeliv

May 22, 2022

Forked from hayes0724/shopify-packer Modern development tool for Shopify using Webpack 5. Easy to extend and customize, zero build config, compatible with Slate and existing websites.

Forked from hayes0724/shopify-packer Modern development tool for Shopify using Webpack 5. Easy to extend and customize, zero build config, compatible with Slate and existing websites.

Shopify Packer Modern development tool for Shopify using Webpack 5. Easy to extend and customize, zero build config, comes with starter themes and com

Nov 24, 2022
Comments
  • Update README.md

    Update README.md

    Although some of the resources prove that word "withing" could be used in this context, "within" would be better from plain english perspective.

    opened by JaoodxD 0
Owner
Georg Oldenburger
Georg Oldenburger
Transpile TypeScript to Espruino flavor of JavaScript for ESP8266/ESP32 microcontrollers template project. Writing safe, maintainable, and testable code is the projects goal.

ESP-TypeScript Transpile TypeScript to Espruino flavor of JavaScript for ESP8266/ESP32 microcontrollers template project. Writing safe, maintainable,

Spencer Kittleson 152 Dec 20, 2022
Compile-time tests for types. Useful to make sure types don't regress into being overly-permissive as changes go in over time.

expect-type Compile-time tests for types. Useful to make sure types don't regress into being overly-permissive as changes go in over time. Similar to

Misha Kaletsky 82 Jan 8, 2023
This is a simple Image popup Jquery plugin. With a very simple configuration, you can show a popup on your webpage. By the way, this plugin works after page load.

Jquery-SingleImagePopup This is a simple Image popup Jquery plugin. With a very simple configuration, you can show a popup on your webpage. By the way

Rajan Karmaker 1 Aug 22, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
Set up and build a Node.js REST API using Typescript, Express, Mongoose with a maintainable and scalable structure.

Introduction Create a maintainable and scalable Node.js REST API with TypeScript, Express and Mongoose. The project structure is based on MVC and foll

Adam Khomsi 16 Nov 18, 2022
Create a maintainable and scalable Node.js GraphQL API with TypeScript, Express, Mongoose and Apollo Server.

Set up and build a Node.js GraphQL API using Typescript, Express, Mongoose with a maintainable and scalable structure

Adam Khomsi 7 Nov 4, 2022
Enhanced interval features for Node.js, such as promisified interval and human readable time parsing.

Interval-next Interval-next is a package that extends Javascript's built-in setInterval() capabilities. You have a plain and promisified interval meth

Snowy 5 Jul 28, 2022
Gofiber with NextJS Static HTML is a small Go program to showcase for bundling a static HTML export of a Next.js app

Gofiber and NextJS Static HTML Gofiber with NextJS Static HTML is a small Go program to showcase for bundling a static HTML export of a Next.js app. R

Mai 1 Jan 22, 2022