deps: upgrade example to use Parcel v2

- deps: remove postcss-modules as Parcel no longer needs it - this also fixes 20+ vulns in the devDeps - use a namespace import for the CSS modules as requested in the docs: https://parceljs.org/languages/css/#css-modules - Per Migration docs (https://parceljs.org/getting-started/migration/): - use `type='module'` in `<script>` tag - use `.parcel-cache` in gitignore instead of `.cache` - misc: Babel is no longer necessary, so might move Parcel into the example dir instead, as it doesn't have to share deps now? - getting warnings from Parcel now that the Babel config is a deopt, but that's being used by Rollup (also still very fast) - misc: add `--open` to Parcel CLI script so it opens in browser window automatically
agilgur5 · Apr 20, 2022 · 646b4b3 · 646b4b3
1 parent d0c672e
commit 646b4b3
Show file tree

Hide file tree

Showing 7 changed files with 10,634 additions and 19,026 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,7 @@
 ### custom ###
 
 # parcel cache
-.cache/
+.parcel-cache/
 # build output
 dist/
 # test coverage output

diff --git a/README.md b/README.md
@@ -107,7 +107,7 @@ The API methods are _mostly_ just wrappers around [`signature_pad`'s API](https:
 
 You can interact with the example in a few different ways:
 
-1. Run `npm start` and navigate to [http://localhost:8080/](http://localhost:8080/).<br>
+1. Run `npm start` and navigate to [http://localhost:1234/](http://localhost:1234/).<br>
 Hosted locally via the [`example/`](example/) directory
 1. [View the live demo here](https://agilgur5.github.io/react-signature-canvas/).<br>
 Hosted via the [`gh-pages` branch](https://github.com/agilgur5/react-signature-canvas/tree/gh-pages), a standalone version of the code in [`example/`](example/)

diff --git a/example/public/index.html b/example/public/index.html
@@ -4,6 +4,6 @@
 </head>
 <body>
   <div id='container'></div>
-  <script src='../src/index.js'></script>
+  <script type='module' src='../src/index.js'></script>
 </body>
 </html>
diff --git a/example/src/index.js b/example/src/index.js
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom'
 
 import SignaturePad from '../../src/index.tsx'
 
-import styles from './styles.module.css'
+import * as styles from './styles.module.css'
 
 class App extends Component {
   state = { trimmedDataURL: null }