[refactor] upgrade to Parcel 2 & Bootstrap 5

[add] Yarn lock for CI cache
EasyWebApp · Feb 5, 2022 · 50e50ab · 50e50ab
1 parent f251dd7
commit 50e50ab
Show file tree

Hide file tree

Showing 10 changed files with 6,718 additions and 85 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -12,11 +12,10 @@ jobs:
             - name: Use Node.js
               uses: actions/setup-node@v2
               with:
-                  node-version: '14'
+                  node-version: 14
+                  cache: yarn
             - name: Install & build
-              run: |
-                  npm install
-                  npm run build
+              run: yarn  &&  yarn build
             - name: Deploy
               uses: peaceiris/actions-gh-pages@v3
               with:

diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,5 @@
 node_modules/
 package-lock.json
-yarn.lock
-.cache/
+.parcel-cache/
 dist/
 .vscode/
diff --git a/ReadMe.md b/ReadMe.md
@@ -7,15 +7,15 @@ App Project scaffold of **WebCell** v2
 https://web-cell.dev/scaffold/
 
 [![NPM Dependency](https://david-dm.org/EasyWebApp/scaffold.svg)][1]
-[![CI & CD](https://github.com/EasyWebApp/scaffold/workflows/CI%20&%20CD/badge.svg)][2]
+[![CI & CD](https://github.com/EasyWebApp/scaffold/actions/workflows/main.yml/badge.svg)][2]
 
 ## Technology stack
 
 -   Language: [TypeScript v4][3]
 -   Component engine: [WebCell v2][4]
--   Component suite: [BootCell v1][5]
+-   Component suite: [BootCell v2][5]
 -   PWA framework: [Workbox v6][6]
--   Package bundler: [Parcel v1][7]
+-   Package bundler: [Parcel v2][7]
 -   CI / CD: GitHub [Actions][8] + [Pages][9]
 
 ## Development
@@ -33,7 +33,7 @@ npm run build
 ```
 
 [1]: https://david-dm.org/EasyWebApp/scaffold
-[2]: https://github.com/EasyWebApp/scaffold/actions
+[2]: https://github.com/EasyWebApp/scaffold/actions/workflows/main.yml
 [3]: https://typescriptlang.org
 [4]: https://web-cell.dev/
 [5]: https://bootstrap.web-cell.dev/

diff --git a/package.json b/package.json
@@ -15,29 +15,29 @@
     "bugs": {
         "url": "https://github.com/EasyWebApp/scaffold/issues"
     },
-    "main": "src/index.html",
     "dependencies": {
-        "boot-cell": "^1.9.5",
+        "boot-cell": "2.0.0-alpha.4",
         "browser-unhandled-rejection": "^1.0.2",
-        "cell-router": "^2.0.4",
+        "cell-router": "^2.1.1",
         "classnames": "^2.3.1",
-        "web-cell": "^2.3.0",
-        "web-utility": "^2.6.0"
+        "web-cell": "^2.4.0-rc.6",
+        "web-utility": "^3.0.1"
     },
     "devDependencies": {
-        "@types/node": "^14.17.5",
-        "@typescript-eslint/eslint-plugin": "^4.28.3",
-        "@typescript-eslint/parser": "^4.28.3",
-        "autoprefixer": "^9.8.6",
-        "eslint": "^7.30.0",
+        "@nuintun/qrcode": "^3.1.1",
+        "@parcel/packager-raw-url": "^2.2.1",
+        "@parcel/transformer-webmanifest": "^2.2.1",
+        "@types/node": "^14.18.10",
+        "@typescript-eslint/eslint-plugin": "^5.10.2",
+        "@typescript-eslint/parser": "^5.10.2",
+        "eslint": "^8.8.0",
         "eslint-config-prettier": "^8.3.0",
-        "husky": "^7.0.1",
-        "lint-staged": "^11.0.1",
-        "parcel-bundler": "^1.12.5",
-        "postcss-modules": "^3.2.2",
-        "prettier": "^2.3.2",
-        "typescript": "^4.3.5",
-        "workbox-cli": "^6.1.5"
+        "husky": "^7.0.4",
+        "lint-staged": "^12.3.3",
+        "parcel": "^2.2.1",
+        "prettier": "^2.5.1",
+        "typescript": "~4.3.5",
+        "workbox-cli": "^6.4.2"
     },
     "prettier": {
         "singleQuote": true,

diff --git a/src/global.d.ts b/src/global.d.ts
@@ -1,47 +1,51 @@
-declare module '*.module.css' {
-    const map: { [key: string]: string };
-
-    export default map;
-}
-
-declare module '*.module.less' {
-    const map: { [key: string]: string };
-
-    export default map;
-}
-
-declare module '*.gif' {
-    const path: string;
-
-    export default path;
-}
-
-declare module '*.png' {
-    const path: string;
-
-    export default path;
-}
-
-declare module '*.jpg' {
-    const path: string;
-
-    export default path;
-}
-
-declare module '*.jpeg' {
-    const path: string;
-
-    export default path;
-}
-
-declare module '*.svg' {
-    const path: string;
-
-    export default path;
-}
-
-declare module '*.webp' {
-    const path: string;
-
-    export default path;
-}
+declare module '*.module.css' {
+    const map: { [key: string]: string };
+
+    export default map;
+}
+
+declare module '*.module.less' {
+    const map: { [key: string]: string };
+
+    export default map;
+}
+
+declare module '*.gif' {
+    const path: string;
+
+    export default path;
+}
+
+declare module '*.png' {
+    const path: string;
+
+    export default path;
+}
+
+declare module '*.jpg' {
+    const path: string;
+
+    export default path;
+}
+
+declare module '*.jpeg' {
+    const path: string;
+
+    export default path;
+}
+
+declare module '*.svg' {
+    const path: string;
+
+    export default path;
+}
+
+declare module '*.webp' {
+    const path: string;
+
+    export default path;
+}
+
+declare module 'browser-unhandled-rejection' {
+    export function auto(): any;
+}
diff --git a/src/index.html b/src/index.html
@@ -14,16 +14,16 @@
         <script src="https://cdn.jsdelivr.net/npm/pwacompat@2.0.17/pwacompat.min.js"></script>
         <link
             rel="stylesheet"
-            href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
+            href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
         />
         <script
             crossorigin
             src="https://polyfill.app/api/polyfill?features=es.array.flat,es.object.from-entries,regenerator-runtime,intersection-observer,resize-observer"
         ></script>
-        <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs@2.5.0/custom-elements-es5-adapter.js"></script>
-        <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs@2.5.0/webcomponents-bundle.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs@2.6.0/custom-elements-es5-adapter.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs@2.6.0/webcomponents-bundle.min.js"></script>
 
-        <script src="index.tsx" async></script>
+        <script type="module" src="index.tsx" async></script>
     </head>
     <body></body>
 </html>
diff --git a/src/model/index.ts b/src/model/index.ts
@@ -1,3 +1,3 @@
-import { History } from 'cell-router/source';
-
-export const history = new History();
+import { History } from 'cell-router';
+
+export const history = new History();
diff --git a/src/page/index.tsx b/src/page/index.tsx
@@ -1,7 +1,6 @@
 import { createCell, Fragment } from 'web-cell';
-import { CellRouter } from 'cell-router/source';
-import { NavBar } from 'boot-cell/source/Navigator/NavBar';
-import { NavLink } from 'boot-cell/source/Navigator/Nav';
+import { CellRouter } from 'cell-router';
+import { NavBar, NavLink } from 'boot-cell';
 
 import { history } from '../model';
 import WebCell_0 from '../image/WebCell-0.png';

diff --git a/workbox-config.js b/workbox-config.js
@@ -3,7 +3,7 @@ module.exports = {
     globPatterns: ['**/*.{html,css,js,json,ico,gif,jpg,jpeg,png,webp}'],
     swDest: 'dist/sw.js',
     importScripts: [
-        'https://cdn.jsdelivr.net/npm/workbox-sw@6.1.5/build/workbox-sw.min.js'
+        'https://cdn.jsdelivr.net/npm/workbox-sw@6.4.2/build/workbox-sw.min.js'
     ],
     clientsClaim: true,
     cleanupOutdatedCaches: true