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!
  • CSS vs. JavaScript
    2026-05-26
  • Scroll-Driven Animations
    2026-04-28
  • Squash and Stretch
    2026-04-13
  • Sneaky Header Blocker Trick
    2026-03-23
  • Sprites on the Web
    2026-02-23
  • Brand New Layouts with CSS Subgrid
    2025-11-25
  • Springs and Bounces in Native CSS
    2025-10-28
  • The Big Gotcha With @starting-style
    2025-09-22
  • Color Shifting in CSS
    2025-09-08
  • An Interactive Guide to SVG Paths
    2025-08-18

RSS Cointelegraph

  • S token drops 5% as 3 former execs resign from Sonic Labs board 2026-06-20
  • Charles Schwab to enter prediction markets with S&P 500 wagers: WSJ 2026-06-19
  • Here’s what happened in crypto today 2026-06-19
  • $13B Bitcoin options expiry looms: Will bulls endure more pain in June? 2026-06-19
  • WhiteBIT secures MiCA license in Austria ahead of July 1 EU deadline 2026-06-19

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

  • A First Look at Scroll-Triggered Animations 2026-06-19
  • The Siren Song of ariaNotify() 2026-06-17
  • Prop For That 2026-06-16
  • What’s !important #13: @function, alpha(), CSS Wordle, and More 2026-06-15
  • Why Isn’t My 3D View Transition Working? 2026-06-12

RSS Coliss

  • AI検索にも対応した改訂新版! SEOの確かな知識をやさしく、そして詳しく学べる解説書 -10年つかえるSEOの基本 2026-06-19
  • Kindle本 夏の特大セールが開催! 人気のデザイン書、UIデザイン・Web制作の解説書、イラスト書も最安値でお買い得です 2026-06-18
  • カワイイけど、可愛すぎないフリーフォント! 可読性にも優れた、MPLUSのバリアブルのUDフォント -M PLUS U 2026-06-17
  • レスポンシブの対応はメディアクエリとclamp()の使い分けが大事! あらゆるプロパティに対応したclamp()の値を生成できる便利ツール -CSS Clamp Generator 2026-06-16
  • コリス限定の太っ腹プレゼント企画! 先週発売された「3+1の配色レシピ」🐖スウォッチデータをまさかの無料配布します🎉 2026-06-15

カテゴリー

  • 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!
  • CSS vs. JavaScript
    2026-05-26
  • Scroll-Driven Animations
    2026-04-28
  • Squash and Stretch
    2026-04-13
  • Sneaky Header Blocker Trick
    2026-03-23
  • Sprites on the Web
    2026-02-23
  • Brand New Layouts with CSS Subgrid
    2025-11-25
  • Springs and Bounces in Native CSS
    2025-10-28
  • The Big Gotcha With @starting-style
    2025-09-22
  • Color Shifting in CSS
    2025-09-08
  • An Interactive Guide to SVG Paths
    2025-08-18

RSS Cointelegraph

  • S token drops 5% as 3 former execs resign from Sonic Labs board 2026-06-20
  • Charles Schwab to enter prediction markets with S&P 500 wagers: WSJ 2026-06-19
  • Here’s what happened in crypto today 2026-06-19
  • $13B Bitcoin options expiry looms: Will bulls endure more pain in June? 2026-06-19
  • WhiteBIT secures MiCA license in Austria ahead of July 1 EU deadline 2026-06-19

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

  • A First Look at Scroll-Triggered Animations 2026-06-19
  • The Siren Song of ariaNotify() 2026-06-17
  • Prop For That 2026-06-16
  • What’s !important #13: @function, alpha(), CSS Wordle, and More 2026-06-15
  • Why Isn’t My 3D View Transition Working? 2026-06-12

RSS Coliss

  • AI検索にも対応した改訂新版! SEOの確かな知識をやさしく、そして詳しく学べる解説書 -10年つかえるSEOの基本 2026-06-19
  • Kindle本 夏の特大セールが開催! 人気のデザイン書、UIデザイン・Web制作の解説書、イラスト書も最安値でお買い得です 2026-06-18
  • カワイイけど、可愛すぎないフリーフォント! 可読性にも優れた、MPLUSのバリアブルのUDフォント -M PLUS U 2026-06-17
  • レスポンシブの対応はメディアクエリとclamp()の使い分けが大事! あらゆるプロパティに対応したclamp()の値を生成できる便利ツール -CSS Clamp Generator 2026-06-16
  • コリス限定の太っ腹プレゼント企画! 先週発売された「3+1の配色レシピ」🐖スウォッチデータをまさかの無料配布します🎉 2026-06-15

カテゴリー

  • 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

React: react-hook-fom with MUI (Material UI)

  • Posted in JavaScript, React, TypeScript

React (TypeScript): Blob/File to base64 using FileReader.readAsDataURL()

  • Posted in React, TypeScript

AWS Amplify: Auth関連まとめ

  • Posted in AWS, GraphQL, React, TypeScript

AWS AmplifyでReactアプリケーション (TypeScript & GraphQL)

  • Posted in AWS, GraphQL, React, TypeScript

Follow me on Twitter.