From dcdcab0ecc86d9643bc9c3c9a9eee8bbad63bb43 Mon Sep 17 00:00:00 2001
From: Felipe Moyano <gafemoyano@gmail.com>
Date: Tue, 23 Aug 2016 10:13:13 -0500
Subject: [PATCH] Added support for webp images in #442 (#458)

---
 config/eslint.js                  | 2 +-
 config/webpack.config.dev.js      | 2 +-
 config/webpack.config.prod.js     | 2 +-
 scripts/utils/createJestConfig.js | 2 +-
 template/README.md                | 4 ++--
 5 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/config/eslint.js b/config/eslint.js
index b2fb7dd7b..eb2a87ce1 100644
--- a/config/eslint.js
+++ b/config/eslint.js
@@ -45,7 +45,7 @@ module.exports = {
   settings: {
     'import/ignore': [
       'node_modules',
-      '\\.(json|css|jpg|png|gif|eot|otf|svg|ttf|woff|woff2|mp4|webm)$',
+      '\\.(json|css|jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm)$',
     ],
     'import/extensions': ['.js'],
     'import/resolver': {
diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js
index 2b6da367f..b93abcdad 100644
--- a/config/webpack.config.dev.js
+++ b/config/webpack.config.dev.js
@@ -126,7 +126,7 @@ module.exports = {
       // When you `import` an asset, you get its (virtual) filename.
       // In production, they would get copied to the `build` folder.
       {
-        test: /\.(ico|jpg|png|gif|eot|otf|svg|ttf|woff|woff2)(\?.*)?$/,
+        test: /\.(ico|jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
         include: [paths.appSrc, paths.appNodeModules],
         exclude: /\/favicon.ico$/,
         loader: 'file',
diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js
index 5781ae863..8b04ec4b6 100644
--- a/config/webpack.config.prod.js
+++ b/config/webpack.config.prod.js
@@ -136,7 +136,7 @@ module.exports = {
       // "file" loader makes sure those assets end up in the `build` folder.
       // When you `import` an asset, you get its filename.
       {
-        test: /\.(ico|jpg|png|gif|eot|otf|svg|ttf|woff|woff2)(\?.*)?$/,
+        test: /\.(ico|jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
         exclude: /\/favicon.ico$/,
         include: [paths.appSrc, paths.appNodeModules],
         loader: 'file',
diff --git a/scripts/utils/createJestConfig.js b/scripts/utils/createJestConfig.js
index a420e6fd6..8b6bfd524 100644
--- a/scripts/utils/createJestConfig.js
+++ b/scripts/utils/createJestConfig.js
@@ -11,7 +11,7 @@ module.exports = (resolve, rootDir) => {
   const config = {
     automock: false,
     moduleNameMapper: {
-      '^[./a-zA-Z0-9$_-]+\\.(jpg|png|gif|eot|otf|svg|ttf|woff|woff2|mp4|webm)$': resolve('config/jest/FileStub.js'),
+      '^[./a-zA-Z0-9$_-]+\\.(jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm)$': resolve('config/jest/FileStub.js'),
       '^[./a-zA-Z0-9$_-]+\\.css$': resolve('config/jest/CSSStub.js')
     },
     persistModuleRegistryBetweenSpecs: true,
diff --git a/template/README.md b/template/README.md
index 37800052b..0395c0f49 100644
--- a/template/README.md
+++ b/template/README.md
@@ -373,7 +373,7 @@ esproposal.class_static_fields=enable
 esproposal.class_instance_fields=enable
 
 module.name_mapper='^\(.*\)\.css$' -> 'react-scripts/config/flow/css'
-module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> 'react-scripts/config/flow/file'
+module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|webp\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> 'react-scripts/config/flow/file'
 
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
@@ -385,7 +385,7 @@ If you later `eject`, you’ll need to replace `react-scripts` references with t
 
 ```ini
 module.name_mapper='^\(.*\)\.css$' -> '<PROJECT_ROOT>/config/flow/css'
-module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> '<PROJECT_ROOT>/config/flow/file'
+module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|webp\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> '<PROJECT_ROOT>/config/flow/file'
 ```
 
 We will consider integrating more tightly with Flow in the future so that you don’t have to do this.
-- 
GitLab