init

.gitignore

@@ -0,0 +1,2 @@
+node_modules/
+.next/

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022-2023 sup39
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,7 @@
+# supMDX
+A template to make blog-like site with MDX and next.js
+
+Note that this template is still in development and may change without compatibility
+
+## Configuration
+- `supMDX.yml`

components/MDXRoot.tsx

@@ -0,0 +1,4 @@
+import {MDXPageFactory} from '@sup39/mdx-page';
+import config from '#config';
+
+export default MDXPageFactory(config);

next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

next.config.mjs

@@ -0,0 +1,43 @@
+import mdx from '@next/mdx';
+import remarkFrontmatter from 'remark-frontmatter';
+import remarkMdxFrontmatter from 'remark-mdx-frontmatter';
+import remarkGfm from 'remark-gfm';
+import remarkMath from 'remark-math';
+import rehypeKatex from 'rehype-katex';
+import ExportHeadings from '@sup39/rehype-mdx-export-headings';
+import ComponentWrapper from '@sup39/rehype-mdx-component-wrapper';
+import AutoImport from '@sup39/rehype-mdx-auto-import';
+
+const withMDX = mdx({
+  extension: /\.mdx?$/,
+  options: {
+    remarkPlugins: [
+      remarkFrontmatter,
+      remarkGfm,
+      remarkMath,
+      [remarkMdxFrontmatter, {name: 'meta'}],
+    ],
+    rehypePlugins: [
+      rehypeKatex,
+      [ExportHeadings, {tags: ['h2'], name: 'headings'}],
+      [ComponentWrapper, {props: ['headings', 'meta']}],
+      [AutoImport,
+        {
+          import: ['T', 'S', 'C'],
+          from: '@sup39/mdx-components',
+        },
+      ],
+    ],
+  },
+});
+export default withMDX({
+  pageExtensions: ['ts', 'tsx', 'js', 'jsx', 'md', 'mdx'],
+  trailingSlash: true,
+  webpack(config) {
+    config.module.rules.push({
+      test: /\.ya?ml$/,
+      use: 'yaml-loader',
+    });
+    return config;
+  },
+});

package.json

@@ -0,0 +1,73 @@
+{
+  "name": "supMDX",
+  "version": "0.1.0",
+  "license": "MIT",
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint --ext .js,.jsx,.ts,.tsx,.mdx ."
+  },
+  "eslintConfig": {
+    "extends": [
+      "next/core-web-vitals",
+      "@sup39/typescript"
+    ],
+    "overrides": [
+      {
+        "files": [
+          "*.ts",
+          "*.tsx"
+        ],
+        "rules": {
+          "no-undef": "off",
+          "@next/next/no-img-element": "off"
+        }
+      },
+      {
+        "files": [
+          "*.mdx"
+        ],
+        "extends": [
+          "plugin:mdx/recommended"
+        ],
+        "rules": {
+          "no-trailing-spaces": "off",
+          "indent": "off"
+        }
+      }
+    ]
+  },
+  "eslintIgnore": [
+    "node_modules"
+  ],
+  "dependencies": {
+    "@mdx-js/loader": "^2.3.0",
+    "@mdx-js/react": "^2.3.0",
+    "@next/mdx": "13.0.7",
+    "@sup39/mdx-components": "^0.1.0",
+    "@sup39/mdx-page": "^0.2.0",
+    "@sup39/rehype-mdx-auto-import": "^1.0.0",
+    "@sup39/rehype-mdx-component-wrapper": "^0.1.0",
+    "@sup39/rehype-mdx-export-headings": "^0.1.1",
+    "next": "13.0.7",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "rehype-katex": "^6.0.2",
+    "remark-frontmatter": "^4.0.1",
+    "remark-gfm": "^3.0.1",
+    "remark-math": "^5.1.1",
+    "remark-mdx-frontmatter": "^2.1.1",
+    "sass": "^1.56.0",
+    "yaml-loader": "^0.8.0"
+  },
+  "devDependencies": {
+    "@sup39/eslint-config-typescript": "^0.1.5",
+    "@types/node": "^18.13.0",
+    "@types/react": "^18.0.28",
+    "eslint": "^8.34.0",
+    "eslint-config-next": "^13.1.6",
+    "eslint-plugin-mdx": "^2.0.5",
+    "typescript": "^4.9.5"
+  }
+}

pages/_app.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import type {AppProps} from 'next/app';
+import {MDXProvider} from '@mdx-js/react';
+import {components} from '@sup39/mdx-components';
+import '../styles/index.sass';
+
+export default function App({Component, pageProps, router}: AppProps) {
+  return <MDXProvider components={components}>
+    <Component router={router} {...pageProps} />
+  </MDXProvider>;
+}

pages/_document.tsx

@@ -0,0 +1,15 @@
+import {Html, Head, Main, NextScript} from 'next/document';
+
+export default function Document() {
+  return <Html>
+    <Head>
+      <link rel="icon" href="/favicon.svg" />
+      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.3/dist/katex.min.css" integrity="sha384-Juol1FqnotbkyZUT5Z7gUPjQ9gzlwCENvUZTpQBAPxtusdwFLRy382PSDx5UUJ4/" crossOrigin="anonymous" />
+      <link rel="stylesheet" type="text/css" href="https://cdn.sup39.dev/css/index.css" />
+    </Head>
+    <body>
+      <Main />
+      <NextScript />
+    </body>
+  </Html>;
+}

pages/index.mdx

@@ -0,0 +1,8 @@
+---
+title: ホーム | サンシャイン研究・開発
+description: スーパーマリオサンシャイン研究・開発のホームページです。
+createdAt: 2023/02/26(日) 01:00:00
+updatedAt: 2023/02/26(日) 01:00:00
+author: サポミク
+h1: ホーム
+---

public/favicon.svg

@@ -0,0 +1,36 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-60,-66 120,120">
+<defs>
+  <path id="limb" d="M50,0 l-20,10 v-20 z"/>
+  <g id="palp">
+    <path d="M55,0 l-25,10 v-20 z"/>
+    <circle cx="55" cy="0" r="7.5"/>
+  </g>
+  <ellipse id="eye" cx="8.5" cy="-4" rx="4" ry="8"/>
+<style>
+g {
+  stroke: #111;
+  stroke-width: 2;
+  fill: #ff9;
+  stroke-linejoin: round;
+}
+#eye {
+  fill: #111;
+  stroke: none;
+}
+</style>
+</defs>
+<g>
+<use xlink:href="#limb"/>
+<use xlink:href="#limb" transform="rotate(45)"/>
+<use xlink:href="#limb" transform="rotate(90)"/>
+<use xlink:href="#limb" transform="rotate(135)"/>
+<use xlink:href="#limb" transform="rotate(180)"/>
+<use xlink:href="#palp" transform="rotate(-45)"/>
+<use xlink:href="#palp" transform="rotate(-90)"/>
+<use xlink:href="#palp" transform="rotate(-135)"/>
+<circle cx="0" cy="0" r="35"/>
+<circle cx="0" cy="0" r="28.5"/>
+<use xlink:href="#eye"/>
+<use xlink:href="#eye" transform="scale(-1,1)"/>
+</g>
+</svg>

styles/index.sass

@@ -0,0 +1 @@
+@import './layout.sass'

styles/layout.sass

@@ -0,0 +1,8 @@
+#icon-link .icon-text
+  padding-left: 2px
+  > div:first-child
+    font-size: 25px
+  font-size: 21px
+
+footer
+  display: none

supMDX-env.d.ts

@@ -0,0 +1,12 @@
+declare module '#config' {
+  import type {MDXConfig} from '@sup39/mdx-page';
+  type Config = MDXConfig & {
+  };
+  const config: Config;
+  export default config;
+}
+
+declare module '*.yaml' {
+  const data: any;
+  export default data;
+}

supMDX.yml

@@ -0,0 +1,11 @@
+site:
+  startYear: 2023
+  title: サンシャイン
+  subtitle: 研究・開発
+  icon: /favicon.svg
+  #author: サポミク
+metaFields:
+  - {attr: createdAt, label: '作成日時：'}
+  - {attr: updatedAt, label: '更新日時：'}
+  - {attr: author, label: '作者：'}
+nav: []

tsconfig.json

@@ -0,0 +1,37 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["components/*"],
+      "#/*": ["pages/*"],
+      "#config": ["supMDX.yml"],
+      "%/*": ["utils/*"]
+    },
+    "target": "es5",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "incremental": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve"
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}