From 6da3e9dde5643a3392b3d725c54c767416dc68a9 Mon Sep 17 00:00:00 2001 From: JJ Kasper Date: Thu, 5 Sep 2019 11:38:34 -0500 Subject: [PATCH 1/3] Add static directory warning --- errors/static-dir-deprecated.md | 47 +++++++++++++++++++++++++ packages/next/README.md | 11 +++--- packages/next/server/next-dev-server.js | 5 +++ 3 files changed, 57 insertions(+), 6 deletions(-) create mode 100644 errors/static-dir-deprecated.md diff --git a/errors/static-dir-deprecated.md b/errors/static-dir-deprecated.md new file mode 100644 index 0000000000000..803eb9a77b306 --- /dev/null +++ b/errors/static-dir-deprecated.md @@ -0,0 +1,47 @@ +# Static directory is deprecated + +#### Why This Error Occurred + +In versions prior to 9.0.6 the `static` directory was used to serve static assets in a Next.js application. This has been deprecated in favor of a `public` directory. + +The reason we want to support a `public` directory instead is to not require the `/static` prefix for assets anymore and there is no reason to maintain both paths. + +#### Possible Ways to Fix It + +Rename your `static` directory to public and update any URLs pointing to these files to not have the `/static` prefix + +**Before** +```sh +static/ + my-image.jpg +pages/ + index.js +components/ + my-image.js +``` + +```jsx +export default function MyImage() { + return +} +``` + +**After** +```sh +public/ + my-image.jpg +pages/ + index.js +components/ + my-image.js +``` + +```jsx +export default function MyImage() { + return +} +``` + +### Useful Links + +- [Static file serving docs](https://nextjs.org/docs#static-file-serving-eg-images) diff --git a/packages/next/README.md b/packages/next/README.md index b71e50617d634..d486112b2b762 100644 --- a/packages/next/README.md +++ b/packages/next/README.md @@ -175,7 +175,7 @@ So far, we get: - Automatic transpilation and bundling (with webpack and babel) - Hot code reloading - Server rendering and indexing of `./pages/` -- Static file serving. `./static/` is mapped to `/static/` (given you [create a `./static/` directory](#static-file-serving-eg-images) inside your project) +- Static file serving. `./public/` is mapped to `/` (given you [create a `./public/` directory](#static-file-serving-eg-images) inside your project) ### Automatic code splitting @@ -276,21 +276,20 @@ To support importing `.css`, `.scss`, `.less` or `.styl` files you can use these ### Static file serving (e.g.: images) -Create a folder called `static` in your project root directory. From your code you can then reference those files with `/static/` URLs: +Create a folder called `public` in your project root directory. From your code you can then reference those files starting from the baseURL `/` ```jsx function MyImage() { - return my image + return my image } export default MyImage ``` - -_Note: Don't name the `static` directory anything else. The name can't be changed and is the only directory that Next.js uses for serving static assets._ +_Note: Don't name the `public` directory anything else. The name can't be changed and is the only directory that Next.js uses for serving static assets._ ### Dynamic Routing diff --git a/packages/next/server/next-dev-server.js b/packages/next/server/next-dev-server.js index 984d9cc20897e..e1945ddff0dc6 100644 --- a/packages/next/server/next-dev-server.js +++ b/packages/next/server/next-dev-server.js @@ -45,6 +45,11 @@ export default class DevServer extends Server { ) }) } + if (fs.existsSync(join(this.dir, 'static'))) { + console.warn( + `The static directory has been deprecated in favor of the public directory. https://err.sh/zeit/next.js/static-dir-deprecated` + ) + } } currentPhase () { From 053322d6ce4c21529d687ac3dc3ed7391b4480ad Mon Sep 17 00:00:00 2001 From: JJ Kasper Date: Sun, 6 Oct 2019 13:49:57 +0200 Subject: [PATCH 2/3] Simplify migration to public directory --- errors/static-dir-deprecated.md | 19 +++++-------------- 1 file changed, 5 insertions(+), 14 deletions(-) diff --git a/errors/static-dir-deprecated.md b/errors/static-dir-deprecated.md index 803eb9a77b306..2a256369860ef 100644 --- a/errors/static-dir-deprecated.md +++ b/errors/static-dir-deprecated.md @@ -8,9 +8,10 @@ The reason we want to support a `public` directory instead is to not require the #### Possible Ways to Fix It -Rename your `static` directory to public and update any URLs pointing to these files to not have the `/static` prefix +You can move your `static` directory inside of the public directory and all URLs will remain the same as they were before **Before** + ```sh static/ my-image.jpg @@ -20,28 +21,18 @@ components/ my-image.js ``` -```jsx -export default function MyImage() { - return -} -``` - **After** + ```sh public/ - my-image.jpg + static/ + my-image.jpg pages/ index.js components/ my-image.js ``` -```jsx -export default function MyImage() { - return -} -``` - ### Useful Links - [Static file serving docs](https://nextjs.org/docs#static-file-serving-eg-images) From b3247042d3c2fd456a8850353e1d794b80415bab Mon Sep 17 00:00:00 2001 From: Tim Neutkens Date: Sun, 6 Oct 2019 13:55:50 +0200 Subject: [PATCH 3/3] Update static-dir-deprecated.md --- errors/static-dir-deprecated.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/errors/static-dir-deprecated.md b/errors/static-dir-deprecated.md index 2a256369860ef..303e7311c8b48 100644 --- a/errors/static-dir-deprecated.md +++ b/errors/static-dir-deprecated.md @@ -8,7 +8,7 @@ The reason we want to support a `public` directory instead is to not require the #### Possible Ways to Fix It -You can move your `static` directory inside of the public directory and all URLs will remain the same as they were before +You can move your `static` directory inside of the `public` directory and all URLs will remain the same as they were before. **Before**