chore: migrate fully to Yarn (#3155)

* chore: migrate to Yarn package manager

* chore: bump deps, move `expose-loader` to correct deps section

* fix: remove package from old typescript shim

* feat: use Yarn Plug'n'Play

* chore: keep `node_modules` ignored for people who choose to use npm anyway

* Revert "feat: use Yarn Plug'n'Play"

This reverts commit 9781c8c8d5.

.github/workflows/js.yml

@@ -18,15 +18,15 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: ${{ env.NODE_VERSION }}
-          cache: "npm"
-          cache-dependency-path: js/package-lock.json
+          cache: "yarn"
+          cache-dependency-path: js/yarn.lock
 
       - name: Install JS dependencies
-        run: npm ci
+        run: yarn install --immutable
         working-directory: ./js
 
       - name: Check JS formatting
-        run: npm run format-check
+        run: yarn run format-check
         working-directory: ./js
 
   build-prod:
@@ -46,8 +46,8 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: ${{ env.NODE_VERSION }}
-          cache: "npm"
-          cache-dependency-path: js/package-lock.json
+          cache: "yarn"
+          cache-dependency-path: js/yarn.lock
 
       # Our action will install npm, cd into `./js`, run `npm run build` and
       # `npm run build-typings`, then commit and upload any changes
@@ -56,7 +56,7 @@ jobs:
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           build_script: build
-          package_manager: npm
+          package_manager: yarn
           typings_script: build-typings
 
   build-test:
@@ -76,8 +76,8 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: ${{ env.NODE_VERSION }}
-          cache: "npm"
-          cache-dependency-path: js/package-lock.json
+          cache: "yarn"
+          cache-dependency-path: js/yarn.lock
 
       # Our action will install npm, cd into `./js`, run `npm run build` and
       # `npm run build-typings`, then commit and upload any changes
@@ -86,6 +86,6 @@ jobs:
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           build_script: build
-          package_manager: npm
+          package_manager: yarn
           typings_script: build-typings
           do_not_commit: true

.gitignore

@@ -1,7 +1,6 @@
 /vendor
 composer.lock
 composer.phar
-node_modules
 .DS_Store
 Thumbs.db
 tests/.phpunit.result.cache

js/.gitignore

@@ -0,0 +1,9 @@
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+node_modules

js/.yarnrc.yml

@@ -0,0 +1,2 @@
+yarnPath: .yarn/releases/yarn-3.1.0.cjs
+nodeLinker: node-modules

js/package.json

@@ -9,7 +9,6 @@
     "clsx": "^1.1.1",
     "color-thief-browser": "^2.0.2",
     "dayjs": "^1.10.7",
-    "expose-loader": "^2.0.0",
     "jquery": "^3.6.0",
     "jquery.hotkeys": "^0.1.0",
     "mithril": "^2.0.4",
@@ -19,7 +18,6 @@
     "throttle-debounce": "^3.0.1"
   },
   "devDependencies": {
-    "@babel/preset-typescript": "^7.15.0",
     "@flarum/prettier-config": "^1.0.0",
     "@types/jquery": "^3.5.8",
     "@types/mithril": "^2.0.8",
@@ -27,13 +25,14 @@
     "@types/textarea-caret": "^3.0.1",
     "bundlewatch": "^0.3.2",
     "cross-env": "^7.0.3",
+    "expose-loader": "^3.1.0",
     "flarum-tsconfig": "^1.0.2",
-    "flarum-webpack-config": "2.0.0",
+    "flarum-webpack-config": "^2.0.0",
     "prettier": "^2.4.1",
     "typescript": "^4.4.4",
-    "webpack": "^5.60.0",
+    "webpack": "^5.61.0",
     "webpack-cli": "^4.9.1",
-    "webpack-merge": "^4.2.2"
+    "webpack-merge": "^5.8.0"
   },
   "scripts": {
     "dev": "webpack --mode development --watch",
@@ -43,5 +42,6 @@
     "format-check": "prettier --check src",
     "clean-typings": "npx rimraf dist-typings && mkdir dist-typings",
     "build-typings": "npm run clean-typings && cp -r src/@types dist-typings/@types && tsc"
-  }
+  },
+  "packageManager": "yarn@3.1.0"
 }

js/webpack.config.js

@@ -1,5 +1,5 @@
 const config = require('flarum-webpack-config');
-const merge = require('webpack-merge');
+const { merge } = require('webpack-merge');
 
 module.exports = merge(config(), {
   output: {