mike-north / js-ts-monorepos Goto Github PK

View Code? Open in Web Editor NEW

219.0 219.0 153.0 1.1 MB

Mike's JS/TS Monorepos Course

Home Page: https://frontendmasters.com/courses/monorepos/

License: BSD 2-Clause "Simplified" License

TypeScript 86.26% Shell 4.13% JavaScript 8.58% HTML 1.03%

js-ts-monorepos's Introduction

JS/TS Monorepos

What's this course about?

This course is intended teach those already somewhat familiar with modern JavaScript and TypeScript about monorepos, their use cases and related tools. Mike shares some of the experience he's had as LinkedIn's TypeScript infrastructure lead, so you don't have to learn things "the hard way" like he did.

Project setup

First, you should ensure you have your ssh keys working with GitHub. You can verify this by running

ssh [email protected]

and getting a response like

Hi mike-north! You've successfully authenticated, but GitHub does not provide shell access.
Connection to github.com closed.

Tools

Next, make sure you have installed volta which ensures you have the right version of node and yarn for this project. You can run:

volta install node

and then:

volta install yarn

To get the right versions for this workshop.

We also strongly recommend the use of Visual Studio Code as an authoring tool. If you use something else, you're on your own.

Clone

Next, checkout a working copy of this project

git clone [email protected]:mike-north/js-ts-monorepos

enter the directory you just created

cd js-ts-monorepos

Install dependencies

yarn is the recommended package manager to use with this project. Please use it instead of npm.

Install dependencies with yarn by running

yarn

Starting the project

Start up the project in development mode by running

yarn dev

Changing any files in the src folder will result in an incremental rebuild, and a refresh of the screen.

By default, the app is served on https://localhost:1234.

Legal

Licensing

The code in this project is licensed as BSD-2-Clause license, and the written content in the ./notes folder is licensed under CC BY-NC-SA 4.0

js-ts-monorepos's People

Contributors

Stargazers

Watchers

Forkers

alexswensen lanre-mark ghinks roystons wildmolasses joumanae andrewbogdanovtss tuandungbrse kayac-chang alexf4dev sabir-nagarro alexandr-g nielsboecker simotae14 anku255 pratapdd nadgerz davidmoshal calebl csaltos willsnake kcmr calebdwilliams mssen sreimer15 pfdzm anandshiva mostafa-drz patrykkarny ron23 kcsuraj jimmy-guzman ochilliam jrvldam mobeenrashid soros xxbingobongoxx etombuyses zacharydonnelly cloudy1gor darekdesu andy14312 brendan1212 pkingo ibedwi nathanescandor mskw23 waterball12 luisfcofv mikebasdeo muhammadsawalhy suddenlygiovanni maniland igregor iparips frontendwizard matthewwbolton madkraft nevetsmik katelu-acl anujit erickborquez test-driven-development vicrosa25 veerashayyagari thekeviv holandadev focusthen zeyuri leannecornish-ft leemellon oroszi1mark iamaandre handasolo pjchender mihaitaivli baixiaoji saulogt krishkashiwala lawrencejews keidarcy hyungjunk brunojppb warren-sadler choinashil sureshratnala ssharifdev lktslionel webdevcaptain thecodegoddess carusog arosenkranz bautistaaa ncattuong lif3ng omerson-cruz mariuszzlotucha baba983 yashbansal-zomato kylemocode

js-ts-monorepos's Issues

scripty fails on windows

running yarn greet throws the following error

scripty > Executing "C:\Users\name\Documents\Development\learn\js-ts-monorepos\scripts\greet":

events.js:292
      throw er; // Unhandled 'error' event
      ^

seems to be a known issue in scripty repo

testdouble/scripty#92

anyone know a workaround? using git bash as terminal

Yarn test fails in utils package

When I run yarn jest under utils package I got this error:

FAIL  tests/deferred.test.ts
  ● Test suite failed to run

    Cannot find module '@shlack/utils' from 'tests/deferred.test.ts'

Types package works fine, I also tried with the same versions of yarn and node used in the video but the bug persists.

Building the ui package

When I look at the content of the ui dist folder after running yarn build, I can see that it was built with Typescript, since the workspace build script is tsc -b packages. Shouldn't we be building the ui package with parcel?

Why Tsconfig and Tsconfig.settings?

Why do you have a tsconfig at the root directory and also one inside the packages directory?
why not just use the one at root level?
can't I just install typescript as a workspace level in the root package.json? do I need to install it one by one?

.eslintrc parserOptions

Hi,
is it possible the eslint parserOption in the packages should have a path relative to the root instead of relative to the package?
It says tsconfig.json but I think it has to be ./packages/(subpackage-name)/tsconfig.json.

Cannot find type declarations

Types declaration not working. Tried with solution branch as well

Couldn't find package "typescript" on the "npm" registry.

Following the instruction on setting up the project, observed the following issues:

running yarn command did not update yarn.lock file as mentioned at @6:00 of the first lesson
running yarn build inside packages/types produced an error: "Couldn't find package "typescript" on the "npm" registry."

I was finally able to resolve the issue by editing ~/.npmrc to include registry=https://registry.yarnpkg.com, and also adding a local .npmrc file inside the js-ts-monorepos project with the same content.

Error in lint script

When scripts/packages/lint.sh has the following code, it works:

#!/usr/bin/env bash
echo "┏━━━ 🕵️‍♀️ LINT: eslint src --ext ts,js,tsx,jsx ━━━━━━━"
eslint src --ext ts,js,tsx,jsx

But if I try to add yarn keyword like this I have an error:

#!/usr/bin/env bash
echo "┏━━━ 🕵️‍♀️ LINT: eslint src --ext ts,js,tsx,jsx ━━━━━━━"
yarn eslint src --ext ts,js,tsx,jsx

Error:

warning package.json: No license field
error Command "eslint" not found.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
scripty ERR! script failed: '/home/felipecesar/development/js-ts-monorepo/scripts/packages/lint.sh'
scripty ERR! exit status: 1
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I don't understand what happened here.

tsc fails to build packages/ui

yarn tsc -b packages fails in packages/ui
parcel build passes

Errors  Files
   176  ../../node_modules/@types/react-router/node_modules/@types/react/index.d.ts:3090
     2  ../../node_modules/@types/react/index.d.ts:3076

Looking at package locks in the above-listed directories

../../node_modules/@types/react/package.json => "version": "16.14.24",
../../node_modules/@types/react-router/node_modules/@types/react/package.json => "version": "17.0.40",

as I've read resolutions": should fix this but no matter what I try tsc fails.

packages/ui/package.json

"devDependencies": {
    "@babel/core": "^7.12.0",
    "@babel/preset-env": "^7.12.0",
    "@babel/preset-react": "^7.10.4",
    "@babel/preset-typescript": "^7.12.0",
    "@types/date-fns": "^2.6.0",
    "@types/express": "^4.17.8",
    "@types/json-server": "^0.14.2",
    "@types/node": "^14.11.8",
    "@types/react": "^16.9.52",
    "@types/react-dom": "^16.9.8",
    "@types/react-router": "^5.1.8",
    "@types/react-router-dom": "^5.1.6",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "react-test-renderer": "^16.14.0",
    "typescript": "^4.0.3"
  },
  "dependencies": {
    "@shlack/data": "^0.1.4",
    "@shlack/types": "^0.1.3",
    "@shlack/utils": "^0.1.4",
    "express": "^4.17.1",
    "json-server": "^0.16.2",
    "parcel-bundler": "^1.12.4",
    "react": "^16.14.0",
    "react-dom": "^16.14.0"
  },
  "resolutions": {
    "@types/react": "^16.9.52"
  },
  "scripty": {
    "windowsPath": "../../scripts-win/packages",
    "path": "../../scripts/packages"
  },