Updated with-now-env example (#7694)
This commit is contained in:
parent
39761e5ce7
commit
7049c3b349
7 changed files with 31 additions and 37 deletions
3
examples/with-now-env/.env.build
Normal file
3
examples/with-now-env/.env.build
Normal file
|
@ -0,0 +1,3 @@
|
|||
# Development keys, for production we recommend Now Secrets
|
||||
SECRET=dev-key
|
||||
ANOTHER_SECRET=another-dev-key
|
|
@ -21,21 +21,28 @@ curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2
|
|||
cd with-now-env
|
||||
```
|
||||
|
||||
Install it and run:
|
||||
Install it with `npm` or `yarn`:
|
||||
|
||||
```bash
|
||||
npm install
|
||||
npm run dev
|
||||
# or
|
||||
yarn
|
||||
```
|
||||
|
||||
Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))
|
||||
Start the development server with [now](https://zeit.co/now) ([download](https://zeit.co/download)):
|
||||
|
||||
```bash
|
||||
now dev
|
||||
```
|
||||
|
||||
Deploy it to the cloud with `now`:
|
||||
|
||||
```bash
|
||||
now
|
||||
```
|
||||
|
||||
keep in mind that in order to deploy the app to `now` the env [secrets](https://zeit.co/docs/getting-started/secrets) defined in `now.json` should be listed in your account
|
||||
keep in mind that in order to deploy the app to `now` the env [secrets](https://zeit.co/docs/getting-started/secrets) defined in `now.json` should be listed in your account.
|
||||
|
||||
## The idea behind the example
|
||||
|
||||
This example shows the usage of [now-env](https://github.com/zeit/now-env), it allows to use secrets in development that will be replaced in production by the secrets defined with [now](https://zeit.co/docs/getting-started/secrets)
|
||||
This example shows the usage of [Now Secrets](https://zeit.co/docs/v2/deployments/environment-variables-and-secrets/?query=secret#securing-environment-variables-using-secrets) and [now dev](https://zeit.co/docs/v2/development/basics), it shows how to add environment variables in development that can be replaced in production by the secrets defined with [Now](https://zeit.co/now).
|
||||
|
|
|
@ -1,21 +1,8 @@
|
|||
/**
|
||||
* After the next require you can use process.env to get your secrets
|
||||
*/
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
require('now-env')
|
||||
}
|
||||
|
||||
console.log({
|
||||
SECRET: process.env.SECRET,
|
||||
ANOTHER_SECRET: process.env.ANOTHER_SECRET,
|
||||
SECRET_FAIL: process.env.SECRET_FAIL
|
||||
ANOTHER_SECRET: process.env.ANOTHER_SECRET
|
||||
})
|
||||
|
||||
/**
|
||||
* If some of the envs are public, like a google maps key, but you still
|
||||
* want to keep them secret from the repo, the following code will allow you
|
||||
* to share some variables with the client, configured at compile time.
|
||||
*/
|
||||
module.exports = {
|
||||
env: {
|
||||
SECRET: process.env.SECRET
|
||||
|
|
|
@ -1,4 +0,0 @@
|
|||
{
|
||||
"@my-secret-key": "keep-it-secret",
|
||||
"@my-other-secret-key": "keep-it-secret-too"
|
||||
}
|
|
@ -1,7 +1,15 @@
|
|||
{
|
||||
"version": 2,
|
||||
"builds": [
|
||||
{
|
||||
"src": "package.json",
|
||||
"use": "@now/next"
|
||||
}
|
||||
],
|
||||
"build": {
|
||||
"env": {
|
||||
"SECRET": "@my-secret-key",
|
||||
"ANOTHER_SECRET": "@my-other-secret-key",
|
||||
"SECRET_FAIL": "@this-is-not-defined"
|
||||
"ANOTHER_SECRET": "@my-other-secret-key"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,17 +1,10 @@
|
|||
{
|
||||
"name": "with-now-env",
|
||||
"version": "2.0.0",
|
||||
"scripts": {
|
||||
"dev": "next",
|
||||
"build": "next build",
|
||||
"start": "next start"
|
||||
},
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"next": "latest",
|
||||
"react": "^16.7.0",
|
||||
"react-dom": "^16.7.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"now-env": "^3.0.4"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,8 +2,8 @@ export default () => (
|
|||
<div className='hello'>
|
||||
<p>
|
||||
Hello World! Here's a secret shared with the client using Next env:{' '}
|
||||
<strong>{process.env.SECRET}</strong>, the secret is shared at compile
|
||||
time, which means every reference to the secret is replaced with its value
|
||||
<strong>{process.env.SECRET}</strong>, the secret is shared at build time,
|
||||
which means every reference to the secret is replaced with its value
|
||||
</p>
|
||||
<style jsx>{`
|
||||
.hello {
|
||||
|
|
Loading…
Reference in a new issue