diff --git a/config/eslint.js b/config/eslint.js index b2fb7dd7bdc..eb2a87ce135 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 5df35d34c6b..c652298a4fc 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -127,7 +127,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 a7253955a2b..6e6d08d2d9c 100644 --- a/config/webpack.config.prod.js +++ b/config/webpack.config.prod.js @@ -137,7 +137,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 a420e6fd6bc..8b6bfd52492 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 37800052b31..0395c0f496a 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$' -> '/config/flow/css' -module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> '/config/flow/file' +module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|webp\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> '/config/flow/file' ``` We will consider integrating more tightly with Flow in the future so that you don’t have to do this.