From e9d14e2b903aec6bb674815f54bf57d3d9f637d7 Mon Sep 17 00:00:00 2001 From: Jeremy Gayed Date: Sat, 3 Sep 2016 08:21:41 -0400 Subject: [PATCH 1/4] Adds JSX extension support --- config/webpack.config.dev.js | 6 +++--- config/webpack.config.prod.js | 7 ++++--- scripts/utils/createJestConfig.js | 1 + 3 files changed, 8 insertions(+), 6 deletions(-) diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js index 3a97767e1fc..d0f3cb7fccf 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -74,7 +74,7 @@ module.exports = { // https://github.com/facebookincubator/create-react-app/issues/253 fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. - extensions: ['.js', '.json', ''], + extensions: ['.jsx', '.js', '.json', ''], alias: { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ @@ -93,7 +93,7 @@ module.exports = { // It's important to do this before Babel processes the JS. preLoaders: [ { - test: /\.js$/, + test: /\.jsx?$/, loader: 'eslint', include: paths.appSrc, } @@ -101,7 +101,7 @@ module.exports = { loaders: [ // Process JS with Babel. { - test: /\.js$/, + test: /\.jsx?$/, include: paths.appSrc, loader: 'babel', query: require('./babel.dev') diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js index af9d35df408..75ef96c38a3 100644 --- a/config/webpack.config.prod.js +++ b/config/webpack.config.prod.js @@ -69,7 +69,8 @@ module.exports = { // https://github.com/facebookincubator/create-react-app/issues/253 fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. - extensions: ['.js', '.json', ''], + // We also include JSX as a common component filename extension. + extensions: ['.jsx', '.js', '.json', ''], alias: { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ @@ -88,7 +89,7 @@ module.exports = { // It's important to do this before Babel processes the JS. preLoaders: [ { - test: /\.js$/, + test: /\.jsx?$/, loader: 'eslint', include: paths.appSrc } @@ -96,7 +97,7 @@ module.exports = { loaders: [ // Process JS with Babel. { - test: /\.js$/, + test: /\.jsx?$/, include: paths.appSrc, loader: 'babel', query: require('./babel.prod') diff --git a/scripts/utils/createJestConfig.js b/scripts/utils/createJestConfig.js index 91c0fb498be..dd15f39b629 100644 --- a/scripts/utils/createJestConfig.js +++ b/scripts/utils/createJestConfig.js @@ -19,6 +19,7 @@ module.exports = (resolve, rootDir) => { } const config = { + moduleFileExtensions: ['jsx', 'js', 'json'], moduleNameMapper: { '^[./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') From 02304e1277f9c4a81a319c001a57f9d05b3a0920 Mon Sep 17 00:00:00 2001 From: Jeremy Gayed Date: Sat, 3 Sep 2016 09:20:32 -0400 Subject: [PATCH 2/4] PR changes --- config/webpack.config.dev.js | 7 ++++--- config/webpack.config.prod.js | 6 +++--- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js index d0f3cb7fccf..762b3effc1d 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -74,7 +74,8 @@ module.exports = { // https://github.com/facebookincubator/create-react-app/issues/253 fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. - extensions: ['.jsx', '.js', '.json', ''], + // We also include JSX as a common component filename extension. + extensions: ['.js', '.json', '.jsx', ''], alias: { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ @@ -93,7 +94,7 @@ module.exports = { // It's important to do this before Babel processes the JS. preLoaders: [ { - test: /\.jsx?$/, + test: /\.(js|jsx)$/, loader: 'eslint', include: paths.appSrc, } @@ -101,7 +102,7 @@ module.exports = { loaders: [ // Process JS with Babel. { - test: /\.jsx?$/, + test: /\.(js|jsx)$/, include: paths.appSrc, loader: 'babel', query: require('./babel.dev') diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js index 75ef96c38a3..b7f23f40501 100644 --- a/config/webpack.config.prod.js +++ b/config/webpack.config.prod.js @@ -70,7 +70,7 @@ module.exports = { fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. // We also include JSX as a common component filename extension. - extensions: ['.jsx', '.js', '.json', ''], + extensions: ['.js', '.json', '.jsx', ''], alias: { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ @@ -89,7 +89,7 @@ module.exports = { // It's important to do this before Babel processes the JS. preLoaders: [ { - test: /\.jsx?$/, + test: /\.(js|jsx)$/, loader: 'eslint', include: paths.appSrc } @@ -97,7 +97,7 @@ module.exports = { loaders: [ // Process JS with Babel. { - test: /\.jsx?$/, + test: /\.(js|jsx)$/, include: paths.appSrc, loader: 'babel', query: require('./babel.prod') From 439b8d51042577f4559cabf296580cb47720b37e Mon Sep 17 00:00:00 2001 From: Jeremy Gayed Date: Sat, 3 Sep 2016 10:02:12 -0400 Subject: [PATCH 3/4] Add testRegex --- scripts/utils/createJestConfig.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/scripts/utils/createJestConfig.js b/scripts/utils/createJestConfig.js index dd15f39b629..95a550be533 100644 --- a/scripts/utils/createJestConfig.js +++ b/scripts/utils/createJestConfig.js @@ -27,7 +27,8 @@ module.exports = (resolve, rootDir) => { scriptPreprocessor: resolve('config/jest/transform.js'), setupFiles: setupFiles, testPathIgnorePatterns: ['/(build|docs|node_modules)/'], - testEnvironment: 'node' + testEnvironment: 'node', + testRegex: '(/__tests__/.*|\\.(test|spec))\\.(js|jsx)$', }; if (rootDir) { config.rootDir = rootDir; From fef7a1aa86f024fbcaf7d84b03e358067abac157 Mon Sep 17 00:00:00 2001 From: Jeremy Gayed Date: Sat, 3 Sep 2016 10:04:55 -0400 Subject: [PATCH 4/4] Add note about not recommending JSX, link to issue --- config/webpack.config.dev.js | 4 +++- config/webpack.config.prod.js | 4 +++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js index 762b3effc1d..e9d5a1f4946 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -74,7 +74,9 @@ module.exports = { // https://github.com/facebookincubator/create-react-app/issues/253 fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. - // We also include JSX as a common component filename extension. + // We also include JSX as a common component filename extension to support + // some tools, although we do not recommend using it, see: + // https://github.com/facebookincubator/create-react-app/issues/290 extensions: ['.js', '.json', '.jsx', ''], alias: { // Support React Native Web diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js index b7f23f40501..be27a29e4bf 100644 --- a/config/webpack.config.prod.js +++ b/config/webpack.config.prod.js @@ -69,7 +69,9 @@ module.exports = { // https://github.com/facebookincubator/create-react-app/issues/253 fallback: paths.nodePaths, // These are the reasonable defaults supported by the Node ecosystem. - // We also include JSX as a common component filename extension. + // We also include JSX as a common component filename extension to support + // some tools, although we do not recommend using it, see: + // https://github.com/facebookincubator/create-react-app/issues/290 extensions: ['.js', '.json', '.jsx', ''], alias: { // Support React Native Web