{"id":20794832,"url":"https://github.com/code-star/rd-2019-01-18-flow-vs-typescript","last_synced_at":"2026-04-20T08:02:50.703Z","repository":{"id":91341661,"uuid":"166420453","full_name":"code-star/rd-2019-01-18-flow-vs-typescript","owner":"code-star","description":null,"archived":false,"fork":false,"pushed_at":"2019-01-21T08:18:05.000Z","size":26,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-12T01:32:58.728Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/code-star.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-01-18T14:50:58.000Z","updated_at":"2019-01-21T08:18:07.000Z","dependencies_parsed_at":"2023-03-13T17:47:46.424Z","dependency_job_id":null,"html_url":"https://github.com/code-star/rd-2019-01-18-flow-vs-typescript","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/code-star/rd-2019-01-18-flow-vs-typescript","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/code-star%2Frd-2019-01-18-flow-vs-typescript","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/code-star%2Frd-2019-01-18-flow-vs-typescript/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/code-star%2Frd-2019-01-18-flow-vs-typescript/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/code-star%2Frd-2019-01-18-flow-vs-typescript/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/code-star","download_url":"https://codeload.github.com/code-star/rd-2019-01-18-flow-vs-typescript/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/code-star%2Frd-2019-01-18-flow-vs-typescript/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32038456,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-20T00:18:06.643Z","status":"online","status_checked_at":"2026-04-20T02:00:06.527Z","response_time":94,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-17T16:18:12.730Z","updated_at":"2026-04-20T08:02:50.688Z","avatar_url":"https://github.com/code-star.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Getting to grips with Flow\n\n### VSCode\n\nIf you've used TypeScript before with VSCode, you may need to do some settings to stop it from bothering you ('Types can only be used in files with a .ts extension').\nYou can disable it permanently or for just your Flow workspace, by disabling `javascript.validate.enable` in your settings.\n\n### Compilation\n\nThere's two simple layers of compilation required to get from the current Flow syntax, back to valid JavaScript that your browser will accept.\n\n##### flow-remove-types\n\nThis one is quite literal in it's function. It literally removes the type syntax that Flow uses. Fun fact: It leaves spaces where the type info used to be, so it does more of a replace than anything else.\n\n```\nfunction foo(x         )         {\n\tif (x) {\n\t\treturn x;\n\t}\n\treturn \"default string\";\n}\n\nclass Test {\n\t             \n\tconstructor(name        )       {\n\t\tthis.name = name;\n\t}\n}\n```\n\n##### babel\n\nBabel is about as straightforward to setup, with one additional configuration file to add, `.babelrc`:\n\n```\n{\n\t\"presets\": [\"flow\"]\n}\n```\n\nAnd from there it's the same thing: `babel src/ -d dist-babel/`\n\nThis one does clean up the spaces neatly.\n\n### Import / Export\n\nExporting a type is as you would expect: `export opaque type FileID = string`\nImporting is a bit different, `import { type FileID} from './index'`, if you forget the `type` in this part; it will complain about using it as a value instead of a type.\n\n### Differences\n- Predicate Functions\n- Classes are limited; no private / public / etc\n\n#### Predicate Functions\nAdds the `%checks` syntax to a function. It's return value is then used by the compiler to make non-null assumptions of variables. This is currently not available in TypeScript.\n\n#### Limited class access modifiers\nIn Flow there are no (known) ways to indicate `private` or `public` functions or variables.\n\n## Conclusion\n\nFlow is more of a small layer on top of your code. In the end you're stil writing raw JavaScript but mixing in the Flow specific type syntax.\n- Pro: Well, it's close to JavaScript.\n- Con: You have non-JS in your `.js` files and in your repository. You can't run a `.js` file in your browser with Flow syntax in it.\n\nTypeScript is a separate language. The extension changes and that makes it feel a bit cleaner. One could argue that you could do the same with Flow's files of course.\nA con of TypeScript in our opinion is that your code is transformed into garbled up JavaScript that is hardly human-readable anymore. You all of a sudden require SourceMaps to make your code readable and debugable, where with Flow you're just running with raw Javascript. \n\nIt's a matter of taste. Flow definitely is easy to setup (although VSCode is a bit TypeScript biased) and has little effect in your build process, where TypeScript is a full on superset and therefore a different language, that requires compilation.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcode-star%2Frd-2019-01-18-flow-vs-typescript","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcode-star%2Frd-2019-01-18-flow-vs-typescript","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcode-star%2Frd-2019-01-18-flow-vs-typescript/lists"}