feat: testing scope package in monorepo+typescript

.npmrc

@@ -7,3 +7,6 @@ save-exact=true
 
 # https://pnpm.io/npmrc
 prefer-workspace-packages=true
+
+# https://github.com/pnpm/pnpm/issues/5068
+node-linker=hoisted

apps/react-demo/package.json

@@ -19,6 +19,7 @@
   },
   "devDependencies": {
     "@apex/webpack-config": "workspace:*",
+    "@types/css-modules": "1.0.5",
     "@types/react": "18.2.37",
     "@types/react-dom": "18.2.15",
     "eslint-plugin-react": "7.34.1",

apps/react-demo/src/component/mobx/MobxThemeSwitch.tsx

@@ -2,6 +2,10 @@ import { observer } from 'mobx-react-lite';
 import { useEffect } from 'react';
 import { useThemeStore } from '../../store/global/theme.store';
 
+// Testing typescript type-check in Monorepo
+// Scope package(@types/css-modules) in this project
+import styles from '../../style/switch.module.less';
+
 export const MobxThemeSwitch = observer(function MobxThemeSwitch() {
     const themeStore = useThemeStore();
 
@@ -11,7 +15,9 @@ export const MobxThemeSwitch = observer(function MobxThemeSwitch() {
 
     return (
         <p>
-            <button onClick={() => themeStore.toggle()}>Switch Theme (Global Level)</button>
+            <button className={styles.button} onClick={() => themeStore.toggle()}>
+                Switch Theme (Global Level)
+            </button>
         </p>
     );
 });

apps/react-demo/src/style/switch.module.less

@@ -0,0 +1,3 @@
+.button {
+    color: red;
+}