Allow extensions other than .js for entry point #4012
Conversation
| console.log(chalk.red(' Name: ') + chalk.cyan(file.base)); | ||
| if (didFallbackExts) { | ||
| // Typescript files will pass the check but are not officially supported. | ||
| const extStr = fallbackExts.filter(e => /\.(?!tsx?)/.test(e)).join(', '); |
There was a problem hiding this comment.
I included .ts and .tsx files but filtered them from the "Supported extensions" string. If you're not ok with this I'll change it, but I'd really love to see (and help with) any movement towards supporting Typescript, even if it's unofficial/undocumented just to make life easier for packages like the one I'm using. I realize the README suggests using create-react-app-typescript, but I prefer react-app-rewired(problem described in docs) because it doesn't "lag behind" when you guys update since it uses react-scripts unmodified, and I love to stay on the bleeding edge!
| // If other types of files need to be passed later without extensions the | ||
| // checkRequiredFiles function will need to be modified. | ||
| const fallbackExts = [ | ||
| '.web.js', |
There was a problem hiding this comment.
I figure I should probably reorder this so .js is at the top since that's the file that will be there by default and I don't want to create unnecessary disk reads. This function just allows the run/build to continue anyway, it doesn't actually decide what file ends up resolved, just makes sure that there's at least one valid option.
| for (const filePath of files) { | ||
| const file = path.parse(filePath); | ||
|
|
||
| if (file.ext === '') { |
There was a problem hiding this comment.
I considered making this
if (file.ext === '' || !fs.existsSync(filePath))so that files with extensions that aren't found would also be checked with fallbacks. But since at the moment the only file other than index.js being required is a .html file, that seemed a bad idea. If this function sees more use in the future, that concept could be revisited.
|
@iansu I'm ready to continue working on this as soon as anyone gets a chance to offer some feedback. :) |
| @@ -54,7 +54,7 @@ module.exports = { | |||
| appBuild: resolveApp('build'), | |||
| appPublic: resolveApp('public'), | |||
| appHtml: resolveApp('public/index.html'), | |||
| appIndexJs: resolveApp('src/index.js'), | |||
| appIndexJs: resolveApp('src/index'), | |||
| appPackageJson: resolveApp('package.json'), | |||
| appSrc: resolveApp('src'), | |||
| testsSetup: resolveApp('src/setupTests.js'), | |||
There was a problem hiding this comment.
@detrohutt: consider removing the .js extension on src/setupTests to generify this file as well (3 instances total in packages/react-scripts/config/paths.js).
This is my proposed solution to #3052 and #3941.
I changed the checkRequiredFiles function to allow passing files with no extension. When a file with no extension is received, it's assumed to be a js-like file. All of the js-like file extensions will be checked.
I can add tests and such over the next few days but I wanted to get some eyes on this to tell me if I'm heading in the right direction.
Edit: If the number of potential disk reads is a concern I could also use
fs.readdirSync()upfront and search the returned array for the different extensions.