feat(website): omit file extensions (dai-shi#655)

packages/website/src/components/code.tsx

@@ -1,4 +1,4 @@
-import { codeToHtml } from '../lib/shiki.js';
+import { codeToHtml } from '../lib/shiki';
 
 type CodeProps = {
   code: string;

packages/website/src/components/destination.tsx

@@ -3,8 +3,8 @@
 import { useEffect } from 'react';
 import { useAtom } from 'jotai';
 
-import { destinationAtom } from '../atoms/index.js';
-import { scrollTo } from '../utils/index.js';
+import { destinationAtom } from '../atoms';
+import { scrollTo } from '../utils';
 
 export const Destination = () => {
   const [destination, setDestination] = useAtom(destinationAtom);

packages/website/src/components/fade.tsx

@@ -3,7 +3,7 @@
 import cx from 'classnames';
 import { useAtomValue } from 'jotai';
 
-import { scrolledAtom } from '../atoms/index.js';
+import { scrolledAtom } from '../atoms';
 
 type FadeProps = {
   always?: boolean;

packages/website/src/components/mdx.tsx

@@ -1,7 +1,7 @@
 import { Link } from 'waku';
 
-import { Code } from './code.js';
-import { getAnchor } from '../utils/index.js';
+import { Code } from '../components/code';
+import { getAnchor } from '../utils';
 
 export const components = {
   h2: ({ children, ...rest }: any) => {

packages/website/src/components/menu.tsx

@@ -5,11 +5,11 @@ import cx from 'classnames';
 import { Link } from 'waku';
 import { useAtom, useSetAtom } from 'jotai';
 
-import { menuAtom, destinationAtom } from '../atoms/index.js';
-import { Logo } from '../components/logo.js';
-import { Sponsors } from '../components/sponsors.js';
-import { useOnClickOutside, useOnEscape } from '../hooks/index.js';
-import { scrollTo } from '../utils/index.js';
+import { menuAtom, destinationAtom } from '../atoms';
+import { Logo } from '../components/logo';
+import { Sponsors } from '../components/sponsors';
+import { useOnClickOutside, useOnEscape } from '../hooks';
+import { scrollTo } from '../utils';
 
 type MenuProps = {
   isHome: boolean;

packages/website/src/components/page.tsx

@@ -1,10 +1,10 @@
 import type { ReactNode } from 'react';
 
-import { Menu } from '../components/menu.js';
-import { Fade } from '../components/fade.js';
-import { Sponsors } from '../components/sponsors.js';
-import { Credits } from '../components/credits.js';
-import { Scroll } from '../components/scroll.js';
+import { Menu } from '../components/menu';
+import { Fade } from '../components/fade';
+import { Sponsors } from '../components/sponsors';
+import { Credits } from '../components/credits';
+import { Scroll } from '../components/scroll';
 
 type PageProps = {
   isHome?: boolean;

packages/website/src/components/providers.tsx

@@ -3,7 +3,7 @@
 import type { ReactNode } from 'react';
 import { createStore, Provider } from 'jotai';
 
-import { menuAtom, scrolledAtom } from '../atoms/index.js';
+import { menuAtom, scrolledAtom } from '../atoms';
 
 type ProvidersProps = { children: ReactNode };
 

packages/website/src/components/scroll.tsx

@@ -5,7 +5,7 @@ import { useEffect } from 'react';
 import { useSetAtom } from 'jotai';
 import { useScroll } from 'framer-motion';
 
-import { scrolledAtom } from '../atoms/index.js';
+import { scrolledAtom } from '../atoms';
 
 export const Scroll = () => {
   const { scrollY } = useScroll();

packages/website/src/components/sponsors.tsx

@@ -3,7 +3,7 @@
 import cx from 'classnames';
 import { useAtomValue } from 'jotai';
 
-import { scrolledAtom } from '../atoms/index.js';
+import { scrolledAtom } from '../atoms';
 
 type SponsorsProps = {
   always?: boolean;

packages/website/src/components/start.tsx

@@ -3,9 +3,9 @@
 import cx from 'classnames';
 import { useAtomValue } from 'jotai';
 
-import { scrolledAtom } from '../atoms/index.js';
-import { Logo } from '../components/logo.js';
-import { scrollTo } from '../utils/index.js';
+import { scrolledAtom } from '../atoms';
+import { Logo } from '../components/logo';
+import { scrollTo } from '../utils';
 
 export const Start = () => {
   const hasScrolled = useAtomValue(scrolledAtom);

packages/website/src/pages/_layout.tsx

@@ -2,8 +2,8 @@ import '../styles.css';
 
 import type { ReactNode } from 'react';
 
-import { Providers } from '../components/providers.js';
-import { Analytics } from '../components/analytics.js';
+import { Providers } from '../components/providers';
+import { Analytics } from '../components/analytics';
 
 type RootLayoutProps = { children: ReactNode };
 

packages/website/src/pages/blog/[slug].tsx

@@ -1,11 +1,11 @@
 import { readdirSync, readFileSync } from 'node:fs';
-// @ts-expect-error no exported member
 import { compileMDX } from 'next-mdx-remote/rsc';
 
-import { Page } from '../../components/page.js';
-import { Meta } from '../../components/meta.js';
-import { components } from '../../components/mdx.js';
-import { getAuthor } from '../../lib/get-author.js';
+import { Page } from '../../components/page';
+import { Meta } from '../../components/meta';
+import { components } from '../../components/mdx';
+import { getAuthor } from '../../lib/get-author';
+import type { BlogFrontmatter } from '../../types';
 
 type BlogArticlePageProps = {
   slug: string;
@@ -23,7 +23,8 @@ export default async function BlogArticlePage({ slug }: BlogArticlePageProps) {
     components,
     options: { parseFrontmatter: true },
   });
-  const { frontmatter, content } = mdx;
+  const { content } = mdx;
+  const frontmatter = mdx.frontmatter as BlogFrontmatter;
 
   const author = getAuthor(frontmatter.author);
   const date = new Date(frontmatter.date).toLocaleDateString('en-US', {
@@ -112,7 +113,7 @@ const getFileName = async (slug: string) => {
       source,
       options: { parseFrontmatter: true },
     });
-    const { frontmatter } = mdx;
+    const frontmatter = mdx.frontmatter as BlogFrontmatter;
     blogSlugToFileName[frontmatter.slug] = fileName;
   }
 
@@ -145,7 +146,7 @@ const getBlogPaths = async () => {
       source,
       options: { parseFrontmatter: true },
     });
-    const { frontmatter } = mdx;
+    const frontmatter = mdx.frontmatter as BlogFrontmatter;
     blogPaths.push(frontmatter.slug);
   }
 

packages/website/src/pages/blog/index.tsx

@@ -1,11 +1,11 @@
 import { Link } from 'waku';
 import { readdirSync, readFileSync } from 'node:fs';
-// @ts-expect-error no exported member
 import { compileMDX } from 'next-mdx-remote/rsc';
 
-import { Page } from '../../components/page.js';
-import { Meta } from '../../components/meta.js';
-import { getAuthor } from '../../lib/get-author.js';
+import { Page } from '../../components/page';
+import { Meta } from '../../components/meta';
+import { getAuthor } from '../../lib/get-author';
+import type { BlogFrontmatter } from '../../types';
 
 export default async function BlogIndexPage() {
   const articles = await getArticles();
@@ -69,7 +69,7 @@ const getArticles = async () => {
       source,
       options: { parseFrontmatter: true },
     });
-    const { frontmatter } = mdx;
+    const frontmatter = mdx.frontmatter as BlogFrontmatter;
 
     const author = getAuthor(frontmatter.author);
     const date = new Date(frontmatter.date).toLocaleDateString('en-US', {

packages/website/src/pages/index.tsx

@@ -1,12 +1,11 @@
-// @ts-expect-error no exported member
 import { compileMDX } from 'next-mdx-remote/rsc';
 
-import { Page } from '../components/page.js';
-import { Meta } from '../components/meta.js';
-import { components } from '../components/mdx.js';
-import { Start } from '../components/start.js';
-import { Destination } from '../components/destination.js';
-import { loadReadme } from '../lib/load-readme.js';
+import { Page } from '../components/page';
+import { Meta } from '../components/meta';
+import { components } from '../components/mdx';
+import { Start } from '../components/start';
+import { Destination } from '../components/destination';
+import { loadReadme } from '../lib/load-readme';
 
 export default async function HomePage() {
   const file = loadReadme();

packages/website/src/types/index.ts

@@ -0,0 +1,8 @@
+export type BlogFrontmatter = {
+  slug: string;
+  title: string;
+  description: string;
+  author: string;
+  release: string;
+  date: string;
+};

packages/website/tsconfig.json

@@ -3,6 +3,8 @@
   "compilerOptions": {
     "rootDir": "./src",
     "outDir": "./dist",
+    "module": "esnext",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "skipLibCheck": true,
     "types": ["node", "react/experimental"]