Skip to the content Skip to the main menu

Time is Life!

Make your life fun and creative!!

  • Sitemap
A freelance web engineer. A dad for two kids :)
Be simple and practical!

Follow me on Twitter.

  • The Post-Developer Era
    2025-04-14
  • A Million Little Secrets
    2025-02-24
  • Container Queries Unleashed
    2025-01-27
  • Next-level frosted glass with backdrop-filter
    2024-12-02
  • A Framework for Evaluating Browser Support
    2024-11-26
  • A Friendly Introduction to Container Queries
    2024-11-04
  • How I Built My Blog
    2024-09-24
  • The Undeniable Utility Of CSS :has
    2024-09-09
  • Promises From The Ground Up
    2024-06-03
  • Snappy UI Optimization with useDeferredValue
    2024-05-13

RSS Cointelegraph

  • How high can Bitcoin price go? 2025-05-09
  • Germany seizes $38M in crypto from Bybit hack-linked eXch exchange 2025-05-09
  • Is Pi Network dead? What really went wrong behind the hype 2025-05-09
  • Solana lacks ‘convincing signs’ of besting Ethereum: Sygnum 2025-05-09
  • Bitcoin accepted at fast food chain Steak ’n Shake from May 16 2025-05-09

RSS CoinPost

  • WiFi共有のDePin系プロジェクト「Roam」、ソラナブロックチェーンに移行 2024-04-01
  • イーサリアムの分散化促進などを期待 ヴィタリック、開発計画「パージ」を説明 2024-04-01
  • Farcaster開発企業、パラダイム主導のラウンドで「ユニコーン」に 2024-04-01
  • コインベースがArkham新規上場、廃止銘柄も 2024-04-01
  • テザー社、ビットコイン保有が7800億円超え 2024-04-01

RSS CSS-Tricks

  • Orbital Mechanics (or How I Optimized a CSS Keyframes Animation) 2025-05-08
  • Why is Nobody Using the hwb() Color Function? 2025-05-07
  • GSAP is Now Completely Free, Even for Commercial Use! 2025-05-06
  • Modern Scroll Shadows Using Scroll-Driven Animations 2025-05-05
  • CSS shape() Commands 2025-05-02

RSS Coliss

  • 想像以上に進化している国産ノーコード制作ツール「Studio」の使い方がよく分かる解説書 -Studio Webサイト制作入門 2025-05-09
  • カルーセルはもうCSSだけで実装できる! 疑似要素::scroll-button()と::scroll-marker()の使い方を解説 2025-05-08
  • Web制作者は要チェック! Chrome 136で新しく追加された6個のCSSの機能 2025-05-07
  • Kindle本のゴールデンウィークセール第2弾が開催! セール初登場もあり、デザイン、配色、イラスト関連の良書がお買い得です 2025-04-28
  • これは読んでおかないと! UIデザインの使いやすさと機能性にフォーカスをあてて詳しく解説したデザイン書 -UIデザインのアイデア帳 2025-04-25

カテゴリー

  • AWS (4)
  • CircleCI (1)
  • CSS (2)
  • Docker (2)
  • GCP (2)
  • GraphQL (2)
  • i18n (2)
  • JavaScript (15)
  • Next.js (4)
  • Node.js (1)
  • Nuxt.js (10)
  • React (10)
  • Sass (2)
  • Storybook (1)
  • tailwindcss (1)
  • TypeScript (18)
  • Web Tech (2)
  • 転職 (2)

Make your life fun and creative!!

  • Sitemap
A freelance web engineer. A dad for two kids :)
Be simple and practical!

Follow me on Twitter.

  • The Post-Developer Era
    2025-04-14
  • A Million Little Secrets
    2025-02-24
  • Container Queries Unleashed
    2025-01-27
  • Next-level frosted glass with backdrop-filter
    2024-12-02
  • A Framework for Evaluating Browser Support
    2024-11-26
  • A Friendly Introduction to Container Queries
    2024-11-04
  • How I Built My Blog
    2024-09-24
  • The Undeniable Utility Of CSS :has
    2024-09-09
  • Promises From The Ground Up
    2024-06-03
  • Snappy UI Optimization with useDeferredValue
    2024-05-13

RSS Cointelegraph

  • How high can Bitcoin price go? 2025-05-09
  • Germany seizes $38M in crypto from Bybit hack-linked eXch exchange 2025-05-09
  • Is Pi Network dead? What really went wrong behind the hype 2025-05-09
  • Solana lacks ‘convincing signs’ of besting Ethereum: Sygnum 2025-05-09
  • Bitcoin accepted at fast food chain Steak ’n Shake from May 16 2025-05-09

RSS CoinPost

  • WiFi共有のDePin系プロジェクト「Roam」、ソラナブロックチェーンに移行 2024-04-01
  • イーサリアムの分散化促進などを期待 ヴィタリック、開発計画「パージ」を説明 2024-04-01
  • Farcaster開発企業、パラダイム主導のラウンドで「ユニコーン」に 2024-04-01
  • コインベースがArkham新規上場、廃止銘柄も 2024-04-01
  • テザー社、ビットコイン保有が7800億円超え 2024-04-01

RSS CSS-Tricks

  • Orbital Mechanics (or How I Optimized a CSS Keyframes Animation) 2025-05-08
  • Why is Nobody Using the hwb() Color Function? 2025-05-07
  • GSAP is Now Completely Free, Even for Commercial Use! 2025-05-06
  • Modern Scroll Shadows Using Scroll-Driven Animations 2025-05-05
  • CSS shape() Commands 2025-05-02

RSS Coliss

  • 想像以上に進化している国産ノーコード制作ツール「Studio」の使い方がよく分かる解説書 -Studio Webサイト制作入門 2025-05-09
  • カルーセルはもうCSSだけで実装できる! 疑似要素::scroll-button()と::scroll-marker()の使い方を解説 2025-05-08
  • Web制作者は要チェック! Chrome 136で新しく追加された6個のCSSの機能 2025-05-07
  • Kindle本のゴールデンウィークセール第2弾が開催! セール初登場もあり、デザイン、配色、イラスト関連の良書がお買い得です 2025-04-28
  • これは読んでおかないと! UIデザインの使いやすさと機能性にフォーカスをあてて詳しく解説したデザイン書 -UIデザインのアイデア帳 2025-04-25

カテゴリー

  • AWS (4)
  • CircleCI (1)
  • CSS (2)
  • Docker (2)
  • GCP (2)
  • GraphQL (2)
  • i18n (2)
  • JavaScript (15)
  • Next.js (4)
  • Node.js (1)
  • Nuxt.js (10)
  • React (10)
  • Sass (2)
  • Storybook (1)
  • tailwindcss (1)
  • TypeScript (18)
  • Web Tech (2)
  • 転職 (2)

Using package.json as a module in TypeScript

If you want to get a value like the version info from package.json, this is what to do.

Add resolveJsonModule config to tsconfig.json.

{
  "compilerOptions": {
    "target": "es5",
    ...
    "resolveJsonModule": true
  }
}

Import package.json in your ts file.

import { version } from 'package.json';
  • Post date
    2021-03-31
  • Posted in JavaScript, TypeScript
Previous post: Next.js with PostCSS 100vh Fix Next post: How to seed data into Mongo with Docker

Related Posts

pdfmake: PDF download in JavaScript (React)

  • Posted in JavaScript, React

Nuxt.js: Font Awesomeの導入(TypeScript)

  • Posted in Nuxt.js, TypeScript

React: IntersectionObserver hook (TypeScript)

  • Posted in JavaScript, React, TypeScript

JavascriptでCSS (Sass) プロパティを利用する

  • Posted in JavaScript, Sass

Follow me on Twitter.