From e42c3c3cbe201fac85f663883bd061a2548d8680 Mon Sep 17 00:00:00 2001 From: Jordan Laramie Date: Tue, 22 Oct 2019 17:56:03 -0400 Subject: [PATCH 1/3] Fix #214 Fully decouple next build from component - Removed `next build` - Updated README with changes - Added missing `inputs` to README - Clarified the use of `nextConfigDir` - Modified `deploy` step --- .../serverless-nextjs-component/README.md | 21 ++++++++++++++----- .../serverless-nextjs-component/serverless.js | 4 ---- 2 files changed, 16 insertions(+), 9 deletions(-) diff --git a/packages/serverless-nextjs-component/README.md b/packages/serverless-nextjs-component/README.md index a620037bbb..0f999d481d 100644 --- a/packages/serverless-nextjs-component/README.md +++ b/packages/serverless-nextjs-component/README.md @@ -75,10 +75,19 @@ AWS_ACCESS_KEY_ID=accesskey AWS_SECRET_ACCESS_KEY=sshhh ``` +Set next.js build target to `serverless`: +```js +// next.config.js + +module.exports = { + target: 'serverless' +} +``` + And simply deploy: ```bash -$ serverless +$ next-build && serverless ``` ### Custom domain name @@ -118,10 +127,12 @@ The fourth cache behaviour handles next API requests `api/*`. ### Inputs -| Name | Type | Default Value | Description | -| ---------- | -------- | ------------- | ------------------------------------------------------------------------------- | -| domain | `Array` | `null` | For example `['admin', 'portal.com']`. | -| bucketName | `string` | `null` | Custom bucket name where static assets are stored. By default is autogenerated. | +| Name | Type | Default Value | Description | +| ------------- | --------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| domain | `Array` | `null` | For example `['admin', 'portal.com']`. | +| bucketName | `string` | `null` | Custom bucket name where static assets are stored. By default is autogenerated. | +| nextConfigDir | `string` | `./` | Directory where your application `next.config.js` file is. This input is useful when the `serverless.yml` is not in the same directory as the next app.
**Note:** `nextConfigDir` should be set if `next.config.js` `distDir` is used. | +| build | `boolean` | `true` | When true builds and deploys app, when false assume the app has been built and uses the .next .serverless_nextjs directories in nextConfigDir to deploy | | Custom inputs can be configured like this: diff --git a/packages/serverless-nextjs-component/serverless.js b/packages/serverless-nextjs-component/serverless.js index 9d9ea51df2..eb004780aa 100644 --- a/packages/serverless-nextjs-component/serverless.js +++ b/packages/serverless-nextjs-component/serverless.js @@ -177,10 +177,6 @@ class NextjsComponent extends Component { ? path.resolve(inputs.nextConfigDir) : process.cwd(); - await execa("node_modules/.bin/next", ["build"], { - cwd: nextConfigPath - }); - await this.emptyBuildDirectory(nextConfigPath); const { From 067a7b2e67b6670d7577438d576bd2da0c791ae6 Mon Sep 17 00:00:00 2001 From: Jordan Laramie Date: Tue, 22 Oct 2019 18:09:37 -0400 Subject: [PATCH 2/3] Added a `nextStaticDir` input for determining where the next.js static resources folder lives --- packages/serverless-nextjs-component/README.md | 1 + packages/serverless-nextjs-component/serverless.js | 9 +++++---- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/serverless-nextjs-component/README.md b/packages/serverless-nextjs-component/README.md index 0f999d481d..7b2c769c52 100644 --- a/packages/serverless-nextjs-component/README.md +++ b/packages/serverless-nextjs-component/README.md @@ -133,6 +133,7 @@ The fourth cache behaviour handles next API requests `api/*`. | bucketName | `string` | `null` | Custom bucket name where static assets are stored. By default is autogenerated. | | nextConfigDir | `string` | `./` | Directory where your application `next.config.js` file is. This input is useful when the `serverless.yml` is not in the same directory as the next app.
**Note:** `nextConfigDir` should be set if `next.config.js` `distDir` is used. | | build | `boolean` | `true` | When true builds and deploys app, when false assume the app has been built and uses the .next .serverless_nextjs directories in nextConfigDir to deploy | | +| staticDir | `string` | `./` | If your `static` or `public` directory is not a direct child of `nextConfigDir` this is needed. | Custom inputs can be configured like this: diff --git a/packages/serverless-nextjs-component/serverless.js b/packages/serverless-nextjs-component/serverless.js index eb004780aa..34fa550e33 100644 --- a/packages/serverless-nextjs-component/serverless.js +++ b/packages/serverless-nextjs-component/serverless.js @@ -199,6 +199,7 @@ class NextjsComponent extends Component { const nextConfigPath = inputs.nextConfigDir ? path.resolve(inputs.nextConfigDir) : process.cwd(); + const nextStaticPath = inputs.nextStaticDir || ""; const [defaultBuildManifest, apiBuildManifest] = await Promise.all([ this.readDefaultBuildManifest(nextConfigPath), @@ -239,14 +240,14 @@ class NextjsComponent extends Component { ]; const [publicDirExists, staticDirExists] = await Promise.all([ - fse.exists(join(nextConfigPath, "public")), - fse.exists(join(nextConfigPath, "static")) + fse.exists(join(nextConfigPath, nextStaticPath, "public")), + fse.exists(join(nextConfigPath, nextStaticPath, "static")) ]); if (publicDirExists) { assetsUpload.push( bucket.upload({ - dir: join(nextConfigPath, "public"), + dir: join(nextConfigPath, nextStaticPath, "public"), keyPrefix: "public" }) ); @@ -255,7 +256,7 @@ class NextjsComponent extends Component { if (staticDirExists) { assetsUpload.push( bucket.upload({ - dir: join(nextConfigPath, "static"), + dir: join(nextConfigPath, nextStaticPath, "static"), keyPrefix: "static" }) ); From e88bd9a5f3bb035be0f972a3b2748267efbdde7f Mon Sep 17 00:00:00 2001 From: Jordan Laramie Date: Tue, 22 Oct 2019 23:36:57 -0400 Subject: [PATCH 3/3] Modified `nextStaticDir` so that it replaces `nextConfigDir` instead of appending to it. I think this is clearer to configure. --- packages/serverless-nextjs-component/serverless.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/packages/serverless-nextjs-component/serverless.js b/packages/serverless-nextjs-component/serverless.js index 34fa550e33..f8ac8a03df 100644 --- a/packages/serverless-nextjs-component/serverless.js +++ b/packages/serverless-nextjs-component/serverless.js @@ -200,6 +200,7 @@ class NextjsComponent extends Component { ? path.resolve(inputs.nextConfigDir) : process.cwd(); const nextStaticPath = inputs.nextStaticDir || ""; + const staticPath = nextStaticPath || nextConfigPath; const [defaultBuildManifest, apiBuildManifest] = await Promise.all([ this.readDefaultBuildManifest(nextConfigPath), @@ -240,14 +241,14 @@ class NextjsComponent extends Component { ]; const [publicDirExists, staticDirExists] = await Promise.all([ - fse.exists(join(nextConfigPath, nextStaticPath, "public")), - fse.exists(join(nextConfigPath, nextStaticPath, "static")) + fse.exists(join(staticPath, "public")), + fse.exists(join(staticPath, "static")) ]); if (publicDirExists) { assetsUpload.push( bucket.upload({ - dir: join(nextConfigPath, nextStaticPath, "public"), + dir: join(staticPath, "public"), keyPrefix: "public" }) ); @@ -256,7 +257,7 @@ class NextjsComponent extends Component { if (staticDirExists) { assetsUpload.push( bucket.upload({ - dir: join(nextConfigPath, nextStaticPath, "static"), + dir: join(staticPath, "static"), keyPrefix: "static" }) );