Merge pull request #9 from aspida/develop

chore(release): 0.9.2

CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.9.2](https://github.com/aspida/pathpida/compare/v0.9.1...v0.9.2) (2020-12-25)
+
+
+### Bug Fixes
+
+* replace params of nuxtjs ([8ef26ef](https://github.com/aspida/pathpida/commit/8ef26ef46a0759e2f1f826f1080d2688c3d22dfa))
+
 ### [0.9.1](https://github.com/aspida/pathpida/compare/v0.9.0...v0.9.1) (2020-12-25)
 
 

README.md

@@ -137,7 +137,7 @@ import { pagesPath } from '../lib/$path'
 console.log(pagesPath.post.create.$url({ query: { userId: 1 }})) // { pathname: '/post/create', query: { userId: 1 }}
 console.log(pagesPath.post.create.$url()) // type error
 console.log(pagesPath.post._pid(1).$url()) // { pathname: '/post/[pid]', query: { pid: 1 }}
-console.log(pagesPath.post._pid(1).$url({ query: { limit: 10 }, hash: '#sample' })) // { pathname: '/post/[pid]', query: { pid: 1, limit: 10 }, hash: '#sample' }
+console.log(pagesPath.post._pid(1).$url({ query: { limit: 10 }, hash: 'sample' })) // { pathname: '/post/[pid]', query: { pid: 1, limit: 10 }, hash: 'sample' }
 
 export default () => {
   const onclick = useCallback(() => {
@@ -312,7 +312,7 @@ export default Vue.extend({
   methods: {
     onclick() {
       this.$router.push(this.$pagesPath.post._pid(1).$url())
-      this.$router.push(this.$pagesPath.post._pid(1).$url({ query: { limit: 10 }, hash: '#sample' }))
+      this.$router.push(this.$pagesPath.post._pid(1).$url({ query: { limit: 10 }, hash: 'sample' }))
     }
   }
 })

__tests__/index.spec.ts

@@ -1,6 +1,6 @@
 import fs from 'fs'
 import { version } from '../package.json'
-import build from '../src/buildTemplate'
+import build, { resetCache } from '../src/buildTemplate'
 import getConfig from '../src/getConfig'
 import { run } from '../src/cli'
 
@@ -18,8 +18,13 @@ describe('cli test', () => {
 
   test('main', () => {
     fs.readdirSync('projects').forEach(dir => {
+      resetCache()
+
       const basePath = `projects/${dir}`
-      const { type, input, staticDir, output, trailingSlash } = getConfig(true, basePath)
+      const { type, input, staticDir, output, trailingSlash } = getConfig(
+        dir !== 'nuxtjs-no-slash',
+        basePath
+      )
 
       const result = fs.readFileSync(`${output}/$path.ts`, 'utf8')
       const { filePath, text } = build({ type, input, staticDir, output, trailingSlash })

package.json

@@ -1,13 +1,13 @@
 {
   "name": "pathpida",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "description": "TypeScript friendly pages path generator for Next.js and Nuxt.js",
   "author": "Solufa <solufa2020@gmail.com>",
   "license": "MIT",
   "types": "dist/cli.d.ts",
   "bin": "bin/index.js",
   "scripts": {
-    "dev": "npm run build && cd projects/nextjs && node ../../bin/index.js -s && cd ../nuxtjs && node ../../bin/index.js --enableStatic",
+    "dev": "npm run build && cd projects/nextjs && node ../../bin/index.js -s && cd ../nuxtjs && node ../../bin/index.js --enableStatic && cd ../nuxtjs-no-slash && node ../../bin/index.js",
     "build": "npm run rimraf && tsc",
     "rimraf": "node -e \"require('fs').rmdirSync('dist', { recursive: true })\"",
     "release": "standard-version --skip.tag",

projects/nuxtjs-no-slash/nuxt.config.ts

@@ -0,0 +1,3 @@
+export default {
+  router: {}
+}

projects/nuxtjs-no-slash/pages/_pid.tsx

@@ -0,0 +1,23 @@
+import Link from 'next/link'
+
+export type OptionalQuery = { hoge: string }
+
+// `onClick`, `href`, and `ref` need to be passed to the DOM element
+// for proper handling
+const MyButton = React.forwardRef(({ onClick, href }, ref) => {
+  return (
+    <a href={href} onClick={onClick} ref={ref}>
+      Click Me
+    </a>
+  )
+})
+
+function Home() {
+  return (
+    <Link href="/about" passHref>
+      <MyButton />
+    </Link>
+  )
+}
+
+export default Home

projects/nuxtjs-no-slash/pages/blog/_slug.tsx

@@ -0,0 +1,23 @@
+import Link from 'next/link'
+
+export type Query = { hoge: string }
+
+// `onClick`, `href`, and `ref` need to be passed to the DOM element
+// for proper handling
+const MyButton = React.forwardRef(({ onClick, href }, ref) => {
+  return (
+    <a href={href} onClick={onClick} ref={ref}>
+      Click Me
+    </a>
+  )
+})
+
+function Home() {
+  return (
+    <Link href="/about" passHref>
+      <MyButton />
+    </Link>
+  )
+}
+
+export default Home

projects/nuxtjs-no-slash/pages/index.tsx

@@ -0,0 +1,94 @@
+import Head from 'next/head'
+import { useCallback, useState, FormEvent, ChangeEvent } from 'react'
+import useAspidaSWR from '@aspida/swr'
+import styles from '~/styles/Home.module.css'
+import { apiClient } from '~/utils/apiClient'
+import { Task } from '<%= orm === "prisma" ? "$prisma/client" : "$/types" %>'
+import UserBanner from '~/components/UserBanner'
+
+export type Query = { hoge: string }
+
+const Home = () => {
+  const { data: tasks, error, revalidate } = useAspidaSWR(apiClient.tasks)
+  const [label, setLabel] = useState('')
+  const inputLabel = useCallback((e: ChangeEvent<HTMLInputElement>) => setLabel(e.target.value), [])
+
+  const createTask = useCallback(
+    async (e: FormEvent) => {
+      e.preventDefault()
+      if (!label) return
+
+      await apiClient.tasks.post({ body: { label } })
+      setLabel('')
+      revalidate()
+    },
+    [label]
+  )
+
+  const toggleDone = useCallback(async (task: Task) => {
+    await apiClient.tasks._taskId(task.id).patch({ body: { done: !task.done } })
+    revalidate()
+  }, [])
+
+  const deleteTask = useCallback(async (task: Task) => {
+    await apiClient.tasks._taskId(task.id).delete()
+    revalidate()
+  }, [])
+
+  if (error) return <div>failed to load</div>
+  if (!tasks) return <div>loading...</div>
+
+  return (
+    <div className={styles.container}>
+      <Head>
+        <title>frourio-todo-app</title>
+        <link rel="icon" href="/favicon.png" />
+      </Head>
+
+      <main className={styles.main}>
+        <UserBanner />
+
+        <h1 className={styles.title}>
+          Welcome to <a href="https://nextjs.org">Next.js!</a>
+        </h1>
+
+        <p className={styles.description}>frourio-todo-app</p>
+
+        <div>
+          <form style={{ textAlign: 'center' }} onSubmit={createTask}>
+            <input value={label} type="text" onChange={inputLabel} />
+            <input type="submit" value="ADD" />
+          </form>
+          <ul className={styles.tasks}>
+            {tasks.map(task => (
+              <li key={task.id}>
+                <label>
+                  <input type="checkbox" checked={task.done} onChange={() => toggleDone(task)} />
+                  <span>{task.label}</span>
+                </label>
+                <input
+                  type="button"
+                  value="DELETE"
+                  style={{ float: 'right' }}
+                  onClick={() => deleteTask(task)}
+                />
+              </li>
+            ))}
+          </ul>
+        </div>
+      </main>
+
+      <footer className={styles.footer}>
+        <a
+          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Powered by <img src="/vercel.svg" alt="Vercel Logo" className={styles.logo} />
+        </a>
+      </footer>
+    </div>
+  )
+}
+
+export default Home

projects/nuxtjs-no-slash/plugins/$path.ts

@@ -0,0 +1,57 @@
+/* eslint-disable */
+import { Plugin } from '@nuxt/types'
+
+type Query0 = { hoge: string }
+
+type OptionalQuery1 = { hoge: string }
+
+type Query2 = { hoge: string }
+
+export const pagesPath = {
+  _pid: (pid: string | number) => ({
+    $url: (url?: { query?: OptionalQuery1, hash?: string }) => ({ path: `/${pid}`, query: url?.query as any, hash: url?.hash })
+  }),
+  aaa: {
+    _bbb: (bbb: string | number) => ({
+      ccc: {
+        $url: (url?: { hash?: string }) => ({ path: `/aaa/${bbb}/ccc`, hash: url?.hash })
+      }
+    })
+  },
+  blog: {
+    _slug: (slug: string | number) => ({
+      $url: (url: { query: Query2, hash?: string }) => ({ path: `/blog/${slug}`, query: url.query as any, hash: url.hash })
+    })
+  },
+  $url: (url: { query: Query0, hash?: string }) => ({ path: '/', query: url.query as any, hash: url.hash })
+}
+
+export type PagesPath = typeof pagesPath
+
+declare module 'vue/types/vue' {
+  interface Vue {
+    $pagesPath: PagesPath
+  }
+}
+
+declare module '@nuxt/types' {
+  interface NuxtAppOptions {
+    $pagesPath: PagesPath
+  }
+
+  interface Context {
+    $pagesPath: PagesPath
+  }
+}
+
+declare module 'vuex/types/index' {
+  interface Store<S> {
+    $pagesPath: PagesPath
+  }
+}
+
+const pathPlugin: Plugin = (_, inject) => {
+  inject('pagesPath', pagesPath)
+}
+
+export default pathPlugin

projects/nuxtjs/plugins/$path.ts

@@ -9,21 +9,21 @@ type Query2 = { hoge: string }
 
 export const pagesPath = {
   _pid: (pid: string | number) => ({
-    $url: (url?: { query?: OptionalQuery1, hash?: string }) => ({ path: '/:pid/' as const, params: { pid } as any, query: url?.query as any, hash: url?.hash })
+    $url: (url?: { query?: OptionalQuery1, hash?: string }) => ({ path: `/${pid}/`, query: url?.query as any, hash: url?.hash })
   }),
   aaa: {
     _bbb: (bbb: string | number) => ({
       ccc: {
-        $url: (url?: { hash?: string }) => ({ path: '/aaa/:bbb/ccc/' as const, params: { bbb } as any, hash: url?.hash })
+        $url: (url?: { hash?: string }) => ({ path: `/aaa/${bbb}/ccc/`, hash: url?.hash })
       }
     })
   },
   blog: {
     _slug: (slug: string | number) => ({
-      $url: (url: { query: Query2, hash?: string }) => ({ path: '/blog/:slug/' as const, params: { slug } as any, query: url.query as any, hash: url.hash })
+      $url: (url: { query: Query2, hash?: string }) => ({ path: `/blog/${slug}/`, query: url.query as any, hash: url.hash })
     })
   },
-  $url: (url: { query: Query0, hash?: string }) => ({ path: '/' as const, query: url.query as any, hash: url.hash })
+  $url: (url: { query: Query0, hash?: string }) => ({ path: '/', query: url.query as any, hash: url.hash })
 }
 
 export type PagesPath = typeof pagesPath

src/buildTemplate.ts

@@ -7,6 +7,11 @@ import createStaticTemplate from './createStaticTemplate'
 let prevPagesText = ''
 let prevStaticText = ''
 
+export const resetCache = () => {
+  prevPagesText = ''
+  prevStaticText = ''
+}
+
 export default (
   { type, input, staticDir, output, trailingSlash }: Config,
   mode?: 'pages' | 'static'