Merge pull request #167 from devrnt/158-syntaxerror-cannot-use-import-statement-outside-a-module

158 syntaxerror cannot use import statement outside a module

Author: devrnt

.github/workflows/deploy.yml

@@ -12,7 +12,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v1
         with:
-          node-version: '14.x'
+          node-version: '18.x'
 
       - name: Get yarn cache
         id: yarn-cache
@@ -26,7 +26,7 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-yarn-
 
-      - run: yarn install --frozen-lockfile
+      - run: yarn install --frozen-lockfile --ignore-engines
       - run: yarn build
       - run: yarn build:playground
 

.github/workflows/main.yml

@@ -7,7 +7,7 @@ jobs:
     runs-on: ${{ matrix.os }}
     strategy:
       matrix:
-        node: ['14.x', '16.x']
+        node: ['16.x', '18.x']
         os: [ubuntu-20.04]
 
     steps:
@@ -21,6 +21,8 @@ jobs:
 
       - name: Install deps and build (with cache)
         uses: bahmutov/npm-install@v1
+        with:
+          install-command: yarn install --ignore-engines
 
       - name: Lint
         run: yarn lint

.github/workflows/size.yml

@@ -6,7 +6,20 @@ jobs:
     env:
       CI_JOB_NUMBER: 1
     steps:
-      - uses: actions/checkout@v1
-      - uses: andresz1/size-limit-action@v1
+      - name: Checkout repo
+        uses: actions/checkout@v2
+
+      - name: Setup Node
+        uses: actions/setup-node@v1
         with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
+          node-version: '18.x'
+
+      - name: Install deps and build (with cache)
+        uses: bahmutov/npm-install@v1
+        with:
+          install-command: yarn install --ignore-engines
+
+      - uses: preactjs/compressed-size-action@v2
+        with:
+          repo-token: '${{ secrets.GITHUB_TOKEN }}'
+          pattern: "**/dist/**/*.?(m)js"

package.json

@@ -3,11 +3,11 @@
   "author": "devrnt <[email protected]>",
   "description": "React wizard (stepper) builder without the hassle, powered by hooks.",
   "homepage": "https://github.com/devrnt/react-use-wizard#readme",
-  "module": "dist/react-use-wizard.esm.js",
+  "module": "dist/react-use-wizard.mjs",
   "version": "2.2.1",
   "license": "MIT",
   "main": "dist/index.js",
-  "typings": "dist/index.d.ts",
+  "types": "dist/index.d.ts",
   "sideEffects": false,
   "repository": {
     "type": "git",
@@ -25,8 +25,8 @@
   },
   "exports": {
     ".": {
-      "browser": "./dist/react-use-wizard.esm.js",
-      "import": "./dist/react-use-wizard.esm.js",
+      "browser": "./dist/react-use-wizard.mjs",
+      "import": "./dist/react-use-wizard.mjs",
       "require": "./dist/index.js"
     }
   },

tsdx.config.js

@@ -0,0 +1,21 @@
+const path = require('node:path');
+
+// Not transpiled with TypeScript or Babel, so use plain Es6/Node.js!
+module.exports = {
+  // This function will run for each entry/format/env combination
+  rollup(config, options) {
+    if (options.format === 'esm') {
+      const outputFile = path.join(__dirname, 'dist', `${options.name}.mjs`);
+
+      return {
+        ...config,
+        output: {
+          ...config.output,
+          file: outputFile,
+        },
+      };
+    }
+
+    return config;
+  },
+};