swisspost / design-system

The Swiss Post Design System pattern library for a consistent and accessible user experience across the web platform.
https://design-system.post.ch
Apache License 2.0
106 stars 13 forks source link

Create package.json utility in components and internet-header package #3027

Closed oliverschuerch closed 2 weeks ago

oliverschuerch commented 2 weeks ago

All our outputted component files contain a hardcoded definition of the package.json properties, because they directly import { version } from 'package.json', which is inlined by the compiler.

We could reduce the size of all of our components by converting the json to a js module first (for example as a utility). So the json data is only stored in within this module and can be used in all the components by importing it.

// src/utils/package.ts
import * as packageJson from '../../package.json';
export const pkg = packageJson;
// src/components/post-component/post-component.tsx
import { pkg } from '@utils/package.';

...

render () {
  return {
    <Host data-version={pkg.version}>
    </Host>
  }
}
oliverschuerch commented 2 weeks ago

This seem to be only a problem in the DEV mode. In production this is heavily optimized by the compiler.