chore: updates template to align with Payload 2.x

Author: JarrodMFlesch

README.md

@@ -7,7 +7,7 @@ Payload is built with a robust infrastructure intended to support Plugins with e
 To build your own Payload plugin, all you need is:
 
 * An understanding of the basic Payload concepts
-* And some JavaScript experience
+* And some JavaScript/Typescript experience
 
 ## Background
 
@@ -24,7 +24,7 @@ export const config = buildConfig({
   plugins: [
     // You can pass options to the plugin
     samplePlugin({
-		enabled: true,
+		  enabled: true,
     }),
   ]
 });
@@ -46,7 +46,7 @@ When you build a plugin, you are purely building a feature for your project and
 
 ### Template Files
 
- In the [payload-plugin-template](https://github.com/payloadcms/payload-plugin-template), you will see a common file structure that is used across all plugins:
+In the [payload-plugin-template](https://github.com/payloadcms/payload-plugin-template), you will see a common file structure that is used across all plugins:
 
 1. root folder
 2. /src folder
@@ -75,9 +75,9 @@ The `samplePlugin` has already been installed to the `payload.config()` file in
 
 ```ts
 plugins: [
-    samplePlugin({
-      enabled: false,
-    })
+  samplePlugin({
+    enabled: false,
+  })
 ]
 ```
 
@@ -95,7 +95,7 @@ Now that we have our environment setup and we have a dev project ready to - it
 
 **index.ts**
 
-First up, the `index.ts` file. It is best practice not to build the plugin directly in this file, instead we use this to export the plugin and types from separate files.
+First up, the `src/index.ts` file. It is best practice not to build the plugin directly in this file, instead we use this to export the plugin and types from separate files.
 
 **Plugin.ts**
 
@@ -104,13 +104,13 @@ To reiterate, the essence of a payload plugin is simply to extend the payload co
 ```ts
 export const samplePlugin =
   (pluginOptions: PluginTypes) =>
-  (incomingConfig: Config): Config => {
-    let config = { ...incomingConfig }
+    (incomingConfig: Config): Config => {
+      let config = { ...incomingConfig }
 
-   // do something cool with the config here
+      // do something cool with the config here
 
-    return config
-  }
+      return config
+    }
 
 ```
 
@@ -156,9 +156,11 @@ config.hooks = {
 Some properties will be slightly different to extend, for instance the onInit property:
 
 ```ts
+import { onInitExtension } from './onInitExtension' // example file
+
 config.onInit = async payload => {
   if (incomingConfig.onInit) await incomingConfig.onInit(payload)
-  // Add additional onInit code by using the onInitExtension function
+  // Add additional onInit code by defining an onInitExtension function
   onInitExtension(pluginOptions, payload)
 }
 ```
@@ -167,30 +169,11 @@ If you wish to add to the onInit, you must include the async/await. We don’t u
 
 In the template, we have stubbed out a basic `onInitExtension` file that you can use, if not needed feel free to delete it.
 
-##### Webpack
-
-If your plugin uses packages or dependencies that are not browser compatible (fs, stripe, nodemailer, etc), you will need to add them to the webpack property to prevent getting errors in build.
-
-Webpack is another part of the payload.config that will be a little more tricky to extend, because we need to carefully pass the existing webpack data to multiple places.
+##### File Aliasing
 
-To simplify this, the template includes a `webpack.ts` file which takes care of spreading the existing webpack, so you can just add your new stuff:
-
-```ts
-const newWebpack = {
-  ...existingWebpackConfig,
-  resolve: {
-    ...(existingWebpackConfig.resolve || {}),
-    alias: {
-      ...(existingWebpackConfig.resolve?.alias ? existingWebpackConfig.resolve.alias : {}),
-      // Add additional aliases here like so:
-      [path.resolve(__dirname, './yourFileHere')]: mockModulePath,
-    },
-  },
-}
-
-```
+If your plugin uses packages or dependencies that are not browser compatible (fs, stripe, nodemailer, etc), you will need to alias them using your bundler to prevent getting errors in build.
 
-You can use the alias Webpack feature to tell Webpack to avoid importing the files or modules you want to restrict to server-only.
+You can read more about aliasing files with Webpack or Vite in the [excluding server modules](https://payloadcms.com/docs/admin/excluding-server-code#aliasing-server-only-modules) docs.
 
 ##### Types.ts
 

dev/.env.example

@@ -1,3 +1,2 @@
-MONGODB_URI=mongodb://127.0.0.1/plugin-development
+DATABASE_URI=mongodb://127.0.0.1/plugin-development
 PAYLOAD_SECRET=hellohereisasecretforyou
-PAYLOAD_SEED=true

dev/.gitignore

@@ -1,166 +1,6 @@
-### Node ###
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-lerna-debug.log*
-.pnpm-debug.log*
-
-# Diagnostic reports (https://nodejs.org/api/report.html)
-report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-*.lcov
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules/
-jspm_packages/
-
-# Snowpack dependency directory (https://snowpack.dev/)
-web_modules/
-
-# TypeScript cache
-*.tsbuildinfo
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Optional stylelint cache
-.stylelintcache
-
-# Microbundle cache
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variable files
-.env
-.env.development.local
-.env.test.local
-.env.production.local
-.env.local
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-.parcel-cache
-
-# Next.js build output
-.next
-out
-
-# Nuxt.js build / generate output
-.nuxt
+build
 dist
-
-# Gatsby files
-.cache/
-# Comment in the public line in if your project uses Gatsby and not Next.js
-# https://nextjs.org/blog/next-9-1#public-directory-support
-# public
-
-# vuepress build output
-.vuepress/dist
-
-# vuepress v2.x temp and cache directory
-.temp
-
-# Docusaurus cache and generated files
-.docusaurus
-
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# TernJS port file
-.tern-port
-
-# Stores VSCode versions used for testing VSCode extensions
-.vscode-test
-
-# yarn v2
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.*
-
-### Node Patch ###
-# Serverless Webpack directories
-.webpack/
-
-# Optional stylelint cache
-
-# SvelteKit build / generate output
-.svelte-kit
-
-### VisualStudioCode ###
-.vscode/*
-!.vscode/settings.json
-!.vscode/tasks.json
-!.vscode/launch.json
-!.vscode/extensions.json
-!.vscode/*.code-snippets
-
-# Local History for Visual Studio Code
-.history/
-
-# Built Visual Studio Code Extensions
-*.vsix
-
-### VisualStudioCode Patch ###
-# Ignore all local history of files
-.history
-.ionide
-
-# Support for Project snippet scope
-.vscode/*.code-snippets
-
-# Ignore code-workspaces
-*.code-workspace
-
-# End of https://www.toptal.com/developers/gitignore/api/node,visualstudiocode
+/media
+node_modules
+.DS_Store
+.env

dev/Dockerfile

@@ -16,6 +16,7 @@ ENV PAYLOAD_CONFIG_PATH=dist/payload.config.js
 
 WORKDIR /home/node/app
 COPY package*.json  ./
+COPY yarn.lock ./
 
 RUN yarn install --production
 COPY --from=builder /home/node/app/dist ./dist

dev/docker-compose.yml

@@ -1,28 +1,24 @@
 version: '3'
 
 services:
-
   payload:
     image: node:18-alpine
     ports:
-      - "3000:3000"
+      - '3000:3000'
     volumes:
       - .:/home/node/app
       - node_modules:/home/node/app/node_modules
     working_dir: /home/node/app/
     command: sh -c "yarn install && yarn dev"
     depends_on:
       - mongo
-    environment:
-      MONGODB_URI: mongodb://mongo:27017/payload
-      PORT: 3000
-      NODE_ENV: development
-      PAYLOAD_SECRET: TESTING
+    env_file:
+      - .env
 
   mongo:
     image: mongo:latest
     ports:
-      - "27017:27017"
+      - '27017:27017'
     command:
       - --storageEngine=wiredTiger
     volumes:

dev/nodemon.json

@@ -1,4 +1,6 @@
 {
+  "$schema": "https://json.schemastore.org/nodemon.json",
   "ext": "ts",
-  "exec": "ts-node src/server.ts"
-}
+  "exec": "ts-node src/server.ts -- -I",
+  "stdin": false
+}

dev/package.json

@@ -1,38 +1,35 @@
 {
-  "name": "plugin-development",
-  "description": "Payload project created from blank template",
+  "name": "Payload2Blank",
+  "description": "A blank template to get started with Payload",
   "version": "1.0.0",
   "main": "dist/server.js",
   "license": "MIT",
   "scripts": {
     "dev": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts nodemon",
-    "test": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts PAYLOAD_SEED=true jest --detectOpenHandles --forceExit",
     "build:payload": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload build",
     "build:server": "tsc",
     "build": "yarn copyfiles && yarn build:payload && yarn build:server",
     "serve": "cross-env PAYLOAD_CONFIG_PATH=dist/payload.config.js NODE_ENV=production node dist/server.js",
     "copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png}\" dist/",
     "generate:types": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:types",
-    "generate:graphQLSchema": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:graphQLSchema"
+    "generate:graphQLSchema": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload generate:graphQLSchema",
+    "payload": "cross-env PAYLOAD_CONFIG_PATH=src/payload.config.ts payload"
   },
   "dependencies": {
+    "@payloadcms/bundler-webpack": "^1.0.0",
+    "@payloadcms/db-mongodb": "^1.0.0",
+    "@payloadcms/plugin-cloud": "^2.0.0",
+    "@payloadcms/richtext-slate": "^1.0.0",
     "cross-env": "^7.0.3",
     "dotenv": "^8.2.0",
     "express": "^4.17.1",
-    "payload": "^1.11.6"
+    "payload": "^2.0.0"
   },
   "devDependencies": {
-    "@swc/jest": "^0.2.26",
     "@types/express": "^4.17.9",
-    "@types/jest": "^29.5.3",
     "copyfiles": "^2.4.1",
-    "jest": "^29.5.0",
-    "mongodb-memory-server": "^8.13.0",
     "nodemon": "^2.0.6",
     "ts-node": "^9.1.1",
     "typescript": "^4.8.4"
-  },
-  "peerDependencies": {
-    "@swc/core": "^1.2.71"
   }
 }