From fb6d3a7374f9855e9deeb041d842c97b148b0f9b Mon Sep 17 00:00:00 2001 From: Rich Brown Date: Mon, 29 Aug 2016 08:48:07 -0400 Subject: [PATCH 1/2] Guidance for a /static folder If people want to serve static files, this change provides guidance for naming the folder. I'm hoping it is correct... --- template/README.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/template/README.md b/template/README.md index 4dd68fcd621..0a0b31fab2a 100644 --- a/template/README.md +++ b/template/README.md @@ -15,7 +15,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Importing a Component](#importing-a-component) - [Adding a Stylesheet](#adding-a-stylesheet) - [Post-Processing CSS](#post-processing-css) -- [Adding Images and Fonts](#adding-images-and-fonts) +- [Serving Static Files - HTML, Images, and Fonts](#serving-static-files-html-images-and-fonts) - [Adding Bootstrap](#adding-bootstrap) - [Adding Flow](#adding-flow) - [Adding Custom Environment Variables](#adding-custom-environment-variables) @@ -272,8 +272,14 @@ becomes this: There is currently no support for preprocessors such as Less, or for sharing variables across CSS files. -## Adding Images and Fonts +## Serving Static Files - HTML, Images, and Fonts +The React App serves static files from the top level directory of the project: +``` +/ - static server returns index.html with React app +/static - static server returns /static/index.html with React app +/static/page.html - static server returns /static/page.html with React app +``` With Webpack, using static assets like images and fonts works similarly to CSS. You can **`import` an image right in a JavaScript module**. This tells Webpack to include that image in the bundle. Unlike CSS imports, importing an image or a font gives you a string value. This value is the final image path you can reference in your code. From 2046716dcd6060b86b5be34e17ba6c0b6fd100af Mon Sep 17 00:00:00 2001 From: Rich Brown Date: Mon, 29 Aug 2016 08:53:10 -0400 Subject: [PATCH 2/2] Fixed link to new section --- template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/template/README.md b/template/README.md index 0a0b31fab2a..2abbbbc5e5a 100644 --- a/template/README.md +++ b/template/README.md @@ -15,7 +15,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Importing a Component](#importing-a-component) - [Adding a Stylesheet](#adding-a-stylesheet) - [Post-Processing CSS](#post-processing-css) -- [Serving Static Files - HTML, Images, and Fonts](#serving-static-files-html-images-and-fonts) +- [Serving Static Files - HTML, Images, and Fonts](#serving-static-files---html-images-and-fonts) - [Adding Bootstrap](#adding-bootstrap) - [Adding Flow](#adding-flow) - [Adding Custom Environment Variables](#adding-custom-environment-variables)