fix: adjust stencil output configs (#154)

Co-authored-by: Felipe Fialho <hi@felipefialho.com>
juntossomosmais · Jun 12, 2023 · 5267123 · 5267123
1 parent f362e95
commit 5267123
Show file tree

Hide file tree

Showing 6 changed files with 154 additions and 24 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -64,6 +64,7 @@
     "@types/jest": "^27.0.3",
     "@types/node": "^18.15.11",
     "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.2.4",
     "@typescript-eslint/eslint-plugin": "^5.52.0",
     "@typescript-eslint/parser": "^5.52.0",
     "autoprefixer": "^10.4.14",

diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
@@ -1,7 +1 @@
-export { AtomButton } from './components/button/button'
-export { AtomChip } from './components/chip/chip'
-export { AtomCol, AtomGrid } from './components/grid'
-export { AtomIcon } from './components/icon/icon'
-export { AtomInput } from './components/input/input'
-export { AtomSelect } from './components/select/select'
-export { AtomTextarea } from './components/textarea/textarea'
+export * from './components'
diff --git a/packages/core/stencil.config.ts b/packages/core/stencil.config.ts
@@ -15,23 +15,121 @@ export const config: Config = {
   globalScript: 'src/global/global.ts',
   globalStyle: 'src/global/global.scss',
   outputTargets: [
-    {
-      type: 'dist',
-      esmLoaderPath: '../loader',
-    },
     vueOutputTarget({
-      componentCorePackage: '@juntossomosmais/atomium/dist',
+      componentCorePackage: '@juntossomosmais/atomium',
       proxiesFile: '../vue/src/components/index.ts',
       includeDefineCustomElements: true,
-      loaderDir: '../loader',
       includePolyfills: true,
     }),
     reactOutputTarget({
-      componentCorePackage: '@juntossomosmais/atomium/dist',
+      componentCorePackage: '@juntossomosmais/atomium',
       proxiesFile: '../react/src/components/index.ts',
       includeDefineCustomElements: true,
-      loaderDir: '../loader',
       includePolyfills: true,
+      // Since Ionic components are imported in `global.ts`
+      // we need to exclude them here to avoid unnecessary imports in the React output module
+      excludeComponents: [
+        'ion-accordion',
+        'ion-accordion-group',
+        'ion-action-sheet',
+        'ion-alert',
+        'ion-app',
+        'ion-avatar',
+        'ion-back-button',
+        'ion-backdrop',
+        'ion-badge',
+        'ion-breadcrumb',
+        'ion-breadcrumbs',
+        'ion-button',
+        'ion-buttons',
+        'ion-card',
+        'ion-card-content',
+        'ion-card-header',
+        'ion-card-subtitle',
+        'ion-card-title',
+        'ion-checkbox',
+        'ion-chip',
+        'ion-col',
+        'ion-content',
+        'ion-datetime',
+        'ion-datetime-button',
+        'ion-fab',
+        'ion-fab-button',
+        'ion-fab-list',
+        'ion-footer',
+        'ion-grid',
+        'ion-header',
+        'ion-icon',
+        'ion-img',
+        'ion-infinite-scroll',
+        'ion-infinite-scroll-content',
+        'ion-input',
+        'ion-item',
+        'ion-item-divider',
+        'ion-item-group',
+        'ion-item-option',
+        'ion-item-options',
+        'ion-item-sliding',
+        'ion-label',
+        'ion-list',
+        'ion-list-header',
+        'ion-loading',
+        'ion-menu',
+        'ion-menu-button',
+        'ion-menu-toggle',
+        'ion-modal',
+        'ion-nav',
+        'ion-nav-link',
+        'ion-note',
+        'ion-picker',
+        'ion-picker-column',
+        'ion-picker-column-internal',
+        'ion-picker-internal',
+        'ion-popover',
+        'ion-progress-bar',
+        'ion-radio',
+        'ion-radio-group',
+        'ion-range',
+        'ion-refresher',
+        'ion-refresher-content',
+        'ion-reorder',
+        'ion-reorder-group',
+        'ion-ripple-effect',
+        'ion-route',
+        'ion-route-redirect',
+        'ion-router',
+        'ion-router-link',
+        'ion-router-outlet',
+        'ion-row',
+        'ion-searchbar',
+        'ion-segment',
+        'ion-segment-button',
+        'ion-select',
+        'ion-select-option',
+        'ion-select-popover',
+        'ion-skeleton-text',
+        'ion-spinner',
+        'ion-split-pane',
+        'ion-tab',
+        'ion-tab-bar',
+        'ion-tab-button',
+        'ion-tabs',
+        'ion-text',
+        'ion-textarea',
+        'ion-thumbnail',
+        'ion-title',
+        'ion-toast',
+        'ion-toggle',
+        'ion-toolbar',
+      ],
     }),
+    {
+      type: 'dist',
+      esmLoaderPath: '../loader',
+    },
+    {
+      type: 'dist-custom-elements',
+      generateTypeDeclarations: true,
+    },
   ] as OutputTargetCustom[],
 }
diff --git a/packages/react/package.json b/packages/react/package.json
@@ -2,12 +2,18 @@
   "name": "@juntossomosmais/atomium-react",
   "description": "React transpiled for Atomium",
   "private": true,
-  "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
+  "files": [
+    "dist/"
+  ],
   "scripts": {
     "start": "tsc -p . --watch",
-    "build": "tsc -p . && npx copyfiles --flat ./package.json ../core/react"
+    "build": "npm run compile && npm run copy",
+    "compile": "npm run build:cjs && npm run build:esm",
+    "build:cjs": "tsc --module commonjs --outDir ../core/react/dist/cjs --declarationDir ../core/react/dist/types",
+    "build:esm": "tsc --module es6 --outDir ../core/react/dist/esm --declarationDir ../core/react/dist/types",
+    "copy": "npx copyfiles --flat ./package.json ../core/react"
   }
 }
diff --git a/packages/react/tsconfig.json b/packages/react/tsconfig.json
@@ -2,18 +2,30 @@
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
     "rootDir": "src",
-    "outDir": "../core/react/dist",
+    "outDir": "dist",
     "lib": ["dom", "es2015"],
-    "module": "es2015",
+    "module": "CommonJS",
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "target": "es2015",
     "skipLibCheck": true,
     "jsx": "react",
     "allowSyntheticDefaultImports": true,
     "declaration": true,
-    "declarationDir": "../core/react/dist/types"
+    "declarationDir": "dist/types",
+    "allowUnreachableCode": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "esModuleInterop": true,
+    "noImplicitAny": true,
+    "noImplicitReturns": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "removeComments": false,
+    "sourceMap": true
   },
-  "include": ["src"],
-  "exclude": ["node_modules"]
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "exclude": ["node_modules"],
+  "compileOnSave": false,
+  "buildOnSave": false
 }