@nuxtus/nuxtus 1.1.1 → 1.3.1

package/CHANGELOG.md

@@ -1,8 +1,86 @@
 Changelog
 
+## [1.3.1](https://github.com/nuxtus/nuxtus/compare/v1.3.0...v1.3.1) (2022-08-17)
+
+
+### Bug Fixes
+
+* :bug: Transpile heroicons for Nuxt 3rc8 compatibility ([3f56efa](https://github.com/nuxtus/nuxtus/commit/3f56efaacfdb5537907acd80b38fa3fe6e1ce12d))
+
+# [1.3.0](https://github.com/nuxtus/nuxtus/compare/v1.2.0...v1.3.0) (2022-07-28)
+
+
+### Features
+
+* :sparkles: use @nuxtus/nuxt-module instead of hard-coded plugins and api endpoints ([c34a601](https://github.com/nuxtus/nuxtus/commit/c34a601e107be87649ead02ab99072c40b1a9922))
+
+# [1.2.0](https://github.com/nuxtus/nuxtus/compare/v1.1.1...v1.2.0) (2022-07-21)
+
+
+### Features
+
+* :zap: directus and nuxt server and port are now configurable ([96bda8b](https://github.com/nuxtus/nuxtus/commit/96bda8bfdd03f2cdca5994b5814070480121e904))
+
 ## [1.1.1](https://github.com/nuxtus/nuxtus/compare/v1.1.0...v1.1.1) (2022-07-11)
 
 
 ### Bug Fixes
 
 * :bug: update @nuxtus/generator to 1.1.2 ([fa02fba](https://github.com/nuxtus/nuxtus/commit/fa02fbae0e00b4dc6c59f3336cb321b43e0d7227))
+
+
+## 1.1.0
+
+- Automatically generate types from collections
+- Tidy up server end point
+- Automatically open browser window on Nuxt start
+
+## 1.0.6
+
+- Add server api endpoint to be used as Directus webhook
+- Update to Directus 9.13.0
+- Update readme with details on using Collections hook
+
+## 1.0.5
+
+- Update nuxtus-cli to v1.0.3
+
+## 1.0.4
+
+- Hard delete the data.db file
+- Update @nuxtus-cli to 1.0.2
+- Update Nuxt to 3.0.0-rc.4
+- Add client, server and start npm scripts
+
+## 1.0.3
+
+- Add Directus CLI to package.json so `npm run cli` works
+- Update getting started instructions to include database migrations
+- Do not upload the sqlite database, create a new one
+- Add default user/password to Directus .env
+- Add @nuxtus/cli to dev dependencies
+- Update `pages/docs.vue` with details on using @nuxtus/cli
+
+## 1.0.2
+
+- Separate create-nuxt command
+
+## 1.0.1
+
+- Correct create command in readme
+- Add details on using Nuxtus CLI
+- Update feedback when installing dependencies
+
+## 1.0.0
+
+- Add `npx nuxtus-create` command
+
+## 0.0.2
+
+- Move to using [nuxt-directus package](https://nuxt-directus.netlify.app/)
+- Add @nuxtus/cli
+- Add .DS_Store to gitignore
+
+## 0.0.1
+
+Initial alpha release.

package/README.md

@@ -1,106 +1,13 @@
 # Nuxtus
 
-A website w/ CMS boilerplate using [Directus](https://directus.io) for backend CMS and [Nuxt](https://nuxtjs.org) (w/ Tailwind CSS) for frontend that can also **automagically** create pages when you create Directus collections.
+A website w/ CMS boilerplate and set of utilities for using [Directus](https://directus.io) for backend CMS and [Nuxt](https://nuxtjs.org) (w/ Tailwind CSS) for frontend. Can also **automagically** create *typed* pages when you create Directus collections.
 
+> Can be used as a boilerplate or a suite of utility tools.
 
-https://user-images.githubusercontent.com/324026/175020548-57ee94b3-dee4-4b12-a8c8-6c0f1a94fab4.mov
+For more details visit [nuxtus.com](https://nuxtus.com) or [read the documentation](https://docs.nuxtus.com)
 
+https://user-images.githubusercontent.com/324026/175020548-57ee94b3-dee4-4b12-a8c8-6c0f1a94fab4.mov
 
 The purpose of this template is to be a quick-start for developing a website with Nuxt.js using Directus as the backend. The end result can be a static website or dynamically pull data from Directus depending on your preference.
 
 It also includes [nuxtus/cli]("https://github.com/nuxtus/cli") which provides a command line interface for quickly creating multiple index/detail pages from any Directus collections.
-
-https://user-images.githubusercontent.com/324026/175452950-46bd51a6-3fd9-441d-80fd-c6bbfaa01929.mp4
-
-## Features
-
-- [Directus](https://directus.io)
-- [Nuxt](https://nuxtjs.org)
-  - [Tailwind CSS](https://tailwindcss.nuxtjs.org/)
-  - [Headless UI](https://headlessui.dev/)
-  - [HeroIcons](https://heroicons.com/)
-  - [Google Fonts](https://github.com/nuxt-community/google-fonts-module)
-  - [Nuxtus CLI](https://github.com/nuxtus/cli)
-  - Typescript types
-
-## Quickstart (preferred)
-
-```bash
-$ npx create-nuxtus app-name
-```
-
-> Replace `app-name` with the name of your website or application.
-
-Nuxtus will automatically migrate the Directus DB if you are using SQLite. Otherwise follow the directions below to manually configure your database and get started.
-
-Your project will contain 2 folders server (Directus) and client (Nuxt).
-
-### Directus
-
-By default Nuxtus uses an SQLite database. If you wish to use an alternative database simply edit the `server/.env` file as suggested in the [Directus documentation](https://docs.directus.io/configuration/config-options/#database) then follow the steps below.
-
-```bash
-$ cd server
-
-# From within the root of the project
-$ npm run cli bootstrap
-```
-
-### Nuxt
-
-No set up for Nuxt is required.
-
-### Starting Nuxtus
-
-From inside your project folder:
-
-```bash
-$ npm start
-```
-
-### Automatically creating pages
-
-**Nuxtus automagically creates Nuxt pages as soon as you create a new Directus collection!**
-
-Nuxtus includes a POST endpoint located /api/directus/collection that will run in development. If you used `npx create-nuxtus` to create your Nuxtus project and selected "yes" to automatically creating pages from Directus then this is already configured in Directus for you.
-
-Collections are also typed automatically, simply prepend "Items" to the collection name as per below:
-
-```typescript
-import { components } from "../interfaces/nuxtus";
-type Test = components["schemas"]["ItemsTest"];
-```
-
-> Because OpenAPI schemas may have invalid TypeScript characters as names, the square brackets are a safe way to access every property.
-
-### Manually creating pages
-
-Nuxtus includes Nuxtus CLI which will generate listing and view pages of any Directus collection on demand. To use it:
-
-1. Log in to Directus ([http://0.0.0.0:8055/admin/login](http://0.0.0.0:8055/admin/login)) and [create a collection](https://docs.directus.io/configuration/data-model/#creating-a-collection)
-2. From the client folder (`cd client`) run `nuxtus create` and follow the prompts
-
-Pages will be created for each collection you select in `clients/pages`. These are a starting point for you to customise.
-
-For more details on [Nuxtus CLI](https://github.com/nuxtus/cli) click [here](https://github.com/nuxtus/cli).
-
-## Production deployment
-
-By default Directus is configured to accept CORS from any origin. Nuxtus suggests modifying this for your production deployment.
-
-If you chose to install, remove the Nuxtus hook extension by deleting the folder `server/extensions/hooks/nuxtus-hook` from your project.
-
-## Manual setup
-
-Clone this repo onto your local machine, remove the remote git origin and add a new one. Then follow the [manual install instructions](#directus).
-
-> For further instructions visit `[http://localhost:3000](http://localhost:3000)`
-
-## Acknowledgements
-
-Nuxtus wouldn't be possible without the following amazing technologies:
-
-[Directus](https://directus.io)
-[Nuxt](https://nuxt.js.org)
-[Nuxt-Directus](https://nuxt-directus.netlify.app/)
-[OpenApi Typescript](https://www.npmjs.com/package/openapi-typescript)

package/TODO

@@ -10,16 +10,29 @@ Todo:
   ✔ Query database use (via interactive shell) in create-app.js @done(22-06-21 20:26)
   ✔ Check node version for compatibility in create-app.js @done(22-06-16 22:07)
   ☐ Look at https://renovatebot.com/
-  ☐ Documentation: https://docusaurus.io/ or https://vuepress.vuejs.org/
+  ✔ Documentation: https://docusaurus.io/ or https://vuepress.vuejs.org/ @done(22-08-11 16:24)
   ✔ Create Directus flow via Directus API @done(22-07-04 17:46)
   ☐ Add ability to automatically update .env for none SQLite databases
-  ☐ Can I HMR when adding new pages/routes? - requires Nuxt to fix bug
-  ☐ Add all questions in create-app to start of process for better user flow
-  ☐ Allow use of different ports/URLs for Directus and Nuxt (currently hard-coded)
-  ☐ Add "types" to cli to update types from Directus when not using hook
-  ☐ Make opening browser window on start optional using npm run start
-  ☐ Make sure separate packages can be used without Nuxt Boilerplate if required
-  ☐ Console.log messages from directus extension should be formatted like other directus messages
+  ☐ Can I HMR when adding new pages/routes? - https://github.com/nuxt/framework/issues/5766 - awaiting rc.7
+  ✔ Add all questions in create-app to start of process for better user flow @done(22-07-13 19:15)
+  ✔ Allow use of different ports/URLs for Directus and Nuxt (currently hard-coded) @done(22-07-13 20:42)
+  ✔ Add "types" to cli to update types from Directus when not using hook - use @directus/sdk for /oas now on all apps @done(22-07-18 17:01)
+  ☐ Make opening browser window on start optional using npm run start (not possible)
+  ✔ Look at moving login and server/api stuff to a Nuxt module @done(22-07-28 19:37)
+  ✔ Make sure separate packages can be used without Nuxt Boilerplate if required @done(22-07-28 19:37)
+  ✔ Console.log messages from directus extension should be formatted like other directus messages @done(22-07-19 20:46)
+  ✔ Add default Directus login to end of create-nuxtus script @done(22-07-19 17:30)
   ☐ When adding a new collection the new page triggers a nuxt restart then directus tries to send a field.create which fails. We get around this by getting the create field first but Directus still returns a 404 for the second request.
   ✔ interfaces/nuxtus.ts should not be in .gitignore other than during my development (remove in create-nuxtus?) @done(22-07-11 12:52)
-  ☐ Add test coverage (done: generator, nuxtus-cli) @started(22-07-11 17:19)
+  ✔ Add test coverage (done: generator, nuxtus-cli) @started(22-07-11 17:19) @done(22-07-14 08:03) @lasted(2d14h44m55s)
+  ☐ GraphQL?
+  ☐ Websockets (https://github.com/br41nslug/directus-websocket-subscribe)
+  ✔ Upgrade nuxt-directus @done(22-07-17 11:32)
+  ☐ Add ability to use Directus static token instead of login (requires nuxt-directus v2.3.0) - UPDATE DOCS cli.md too!
+  ☐ Get added to some nuxt/directus lists etc.
+  ☐ Directus and Nuxt project names in package.json based on project create name.
+  ☐ Add Directus and Nuxt URL to create-nuxtus script
+  ☐ Create a new package.json instead of using nuxtus one (remove all semantic release packages)
+  ☐ Remove Google Fonts module (replace with fonts.bunny.net?)
+  ☐ Use directus install scripts (then copy hook) instead of npm install - this will sort out DB automatically!
+  ☐ Nuxtus website should actually pull data from Directus!

package/client/nuxt.config.ts

@@ -11,17 +11,23 @@ export default defineNuxtConfig({
 		],
 		"@nuxtjs/tailwindcss",
 	],
-	modules: ["nuxt-directus"],
+	modules: ["nuxt-directus", "@nuxtus/nuxt-module"],
 	googleFonts: {
 		families: {
 			Inter: true,
 		},
 	},
+	build: {
+		transpile: ['@heroicons/vue']
+	},
 	tailwindcss: {
 		// Options
 		jit: true,
 	},
 	directus: {},
+	nuxtus: {
+		authDirectus: true,
+	},
 	publicRuntimeConfig: {
 		directusEmail: "",
 		directusPassword: "",

package/client/package.json

@@ -9,14 +9,13 @@
   "devDependencies": {
     "@nuxtjs/google-fonts": "^1.3.0",
     "@nuxtjs/tailwindcss": "^5.0.4",
-    "@nuxtus/cli": "^1.0.7",
-    "@nuxtus/generator": "1.1.2",
-    "nuxt": "3.0.0-rc.4",
-    "openapi-typescript": "^5.4.1"
+    "@nuxtus/cli": "^1.1.2",
+    "@nuxtus/nuxt-module": "^1.0.3",
+    "nuxt": "^3.0.0-rc.8"
   },
   "dependencies": {
     "@headlessui/vue": "^1.6.1",
     "@heroicons/vue": "^1.0.6",
-    "nuxt-directus": "^2.1.0"
+    "nuxt-directus": "^2.3.0"
   }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@nuxtus/nuxtus",
 	"description": "Directus/Nuxt boilerplate with Tailwind CSS.",
-	"version": "1.1.1",
+	"version": "1.3.1",
 	"repository": {
 		"type": "git",
 		"url": "git+https://github.com/nuxtus/nuxtus.git"

package/server/.env

@@ -69,3 +69,7 @@ EMAIL_SENDMAIL_PATH="/usr/sbin/sendmail"
 ## Default User
 ADMIN_EMAIL="admin@example.com"
 ADMIN_PASSWORD="password"
+
+####################################################################################################
+## NUXT SERVER
+NUXT_SERVER="http://localhost:3000"

package/server/package.json

@@ -11,7 +11,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "directus": "^9.14.1",
+    "directus": "^9.15.1",
     "sqlite3": "^5.0.8"
   }
 }

package/changelog.md

@@ -1,57 +0,0 @@
-# Changelog
-
-## 1.1.0
-
-- Automatically generate types from collections
-- Tidy up server end point
-- Automatically open browser window on Nuxt start
-
-## 1.0.6
-
-- Add server api endpoint to be used as Directus webhook
-- Update to Directus 9.13.0
-- Update readme with details on using Collections hook
-
-## 1.0.5
-
-- Update nuxtus-cli to v1.0.3
-
-## 1.0.4
-
-- Hard delete the data.db file
-- Update @nuxtus-cli to 1.0.2
-- Update Nuxt to 3.0.0-rc.4
-- Add client, server and start npm scripts
-
-## 1.0.3
-
-- Add Directus CLI to package.json so `npm run cli` works
-- Update getting started instructions to include database migrations
-- Do not upload the sqlite database, create a new one
-- Add default user/password to Directus .env
-- Add @nuxtus/cli to dev dependencies
-- Update `pages/docs.vue` with details on using @nuxtus/cli
-
-## 1.0.2
-
-- Separate create-nuxt command
-
-## 1.0.1
-
-- Correct create command in readme
-- Add details on using Nuxtus CLI
-- Update feedback when installing dependencies
-
-## 1.0.0
-
-- Add `npx nuxtus-create` command
-
-## 0.0.2
-
-- Move to using [nuxt-directus package](https://nuxt-directus.netlify.app/)
-- Add @nuxtus/cli
-- Add .DS_Store to gitignore
-
-## 0.0.1
-
-Initial alpha release.

package/client/plugins/directusLogin.client.ts

@@ -1,12 +0,0 @@
-export default defineNuxtPlugin(async (nuxtApp) => {
-	try {
-		const config = useRuntimeConfig()
-		const { login } = useDirectusAuth()
-		await login({
-			email: config.public.directusEmail,
-			password: config.public.directusPassword,
-		})
-	} catch (error) {
-		console.error(error)
-	}
-})

package/client/server/api/directus/collection.post.ts

@@ -1,17 +0,0 @@
-import { createPage } from "@nuxtus/generator"
-
-export default defineEventHandler(async (event) => {
-	if (process.env.NODE_ENV !== "production") {
-		const body = await useBody(event)
-		try {
-			const collection = body.collection
-			createPage(collection, body.singleton)
-		} catch (err) {
-			console.error(err.message)
-			throw new Error("Unable to create page: " + err.message)
-		}
-		return {
-			api: "ok",
-		}
-	}
-})

package/client/server/api/directus/field.post.ts

@@ -1,32 +0,0 @@
-import axios from "axios"
-import fs from "fs"
-import openapiTS from "openapi-typescript"
-
-export default defineEventHandler(async (event) => {
-	if (process.env.NODE_ENV !== "production") {
-		const config = useRuntimeConfig()
-		// TODO: Can't seem to share login from directusLogin (currently client only plugin)
-		try {
-			const { data } = await axios.post("http://localhost:8055/auth/login", {
-				email: config.public.directusEmail,
-				password: config.public.directusPassword,
-			})
-			axios.defaults.headers.common[
-				"Authorization"
-			] = `Bearer ${data.data.access_token}`
-		} catch (err) {
-			console.error("Failed to login to Directus: " + err.message)
-			throw err
-		}
-		const openapi = await axios.get("http://localhost:8055/server/specs/oas")
-		// console.log(JSON.stringify(openapi.data.components.schemas))
-		const types = await openapiTS(openapi.data)
-		if (!fs.existsSync("interfaces")) {
-			fs.mkdirSync("interfaces")
-		}
-		fs.writeFileSync("interfaces/nuxtus.ts", types)
-		return {
-			api: "ok",
-		}
-	}
-})