Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Updating react-workspace/react-script version 3.3.0 to facebook/react-script 3.4.0 #19

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
F1LT3R merged 67 commits into react-workspaces:master from Jagatmachines:master
Mar 18, 2020

Conversation

@Jagatmachines
Copy link
Contributor

@Jagatmachines Jagatmachines commented Feb 19, 2020

Updating react-workspace/react-script version 3.3.0 to facebook/react-script 3.4.0 for Downgrade style-loader to v0.23.1 due to CSS modules hot reload not working with v1.0.0

mikecaulley and others added 30 commits December 4, 2019 22:35
Declare namespaces are supported by babel now, and babel will throw with a nice error message for non-declare namespaces, so this rule is unnecessary. Closes #7651.
This is just a comment fix.
Actual optional chaining operator syntax is `?.`, not `.?`.
Make the --info subcommand outuput the current version information and the location of the file being run. Our issue template tells users to provide the output of --info, so having the current version is incredibly helpful, especially since it doesn't necessarily match the globally installed version that envinfo outputs. Knowing the location helps us determine whether the running bin is globally installed or in the local node_modules.
* Bump dependencies in react-dev-utils
* Bump dependencies in react-app-polyfill
* Bump dependencies in create-react-app
* Bump dependencies in react-error-overlay
* Bump dependencies in react-scripts
* Bump react
* Add package-runner note to readme
* Add link to `yarn create`
- Remove templates version minimum stopgap.
- Replace indexOf with more idiomatic alternatives.
- Inline errorLogFilePatterns.
- Alphabetize validFiles.
- Simplify log file removal code.
- Move unconditional console.log() call outside of isSafe.
- Differentiate conflicting directories from files.
- Document yarn version special case.
- Inline printValidationResults.
- Standardize checkAppName output on failure.
- Add link for checkThatNpmCanReadCwd.
Functionally the code should be exactly the same.
The old favicon was the same as the official react documentation, which is a minor annoyance during development when trying to find the tab you want. The new favicon is just the old with inverted colors.
Closes #7957
This removes `React.FC` from the base template for a Typescript project.
Long explanation for a small change: 
`React.FC` is unnecessary: it provides next to no benefits and has a few downsides. (See below.) I see a lot of beginners to TS+React using it, however, and I think that it's usage in this template is a contributing factor to that, as the prominence of this template makes it a de facto source of "best practice". 
### Downsides to React.FC/React.FunctionComponent
##### Provides an implicit definition of `children`
Defining a component with `React.FC` causes it to implicitly take `children` (of type `ReactNode`). It means that all components accept children, even if they're not supposed to, allowing code like:
```ts
const App: React.FC = () => { /*... */ };
const Example = () => {
	<App><div>Unwanted children</div></App>
}
```
This isn't a run-time error, but it is a mistake and one that would be caught by Typescript if not for `React.FC`. 
##### Doesn't support generics.
I can define a generic component like:
```ts
type GenericComponentProps<T> = {
 prop: T
 callback: (t: T) => void
}
const GenericComponent = <T>(props: GenericComponentProps<T>) => {/*...*/}
```
But it's not possible when using `React.FC` - there's no way to preserve the unresolved generic `T` in the type returned by `React.FC`.
```ts
const GenericComponent: React.FC</* ??? */> = <T>(props: GenericComponentProps<T>) => {/*...*/}
```
##### Makes "component as namespace pattern" more awkward.
It's a somewhat popular pattern to use a component as a namespace for related components (usually children):
```jsx
<Select>
	<Select.Item />
</Select>
```
This is possible, but awkward, with `React.FC`:
```tsx
const Select: React.FC<SelectProps> & { Item: React.FC<ItemProps> } = (props) => {/* ... */ }
Select.Item = (props) => { /*...*/ }
```
but "just works" without `React.FC`:
```tsx
const Select = (props: SelectProps) => {/* ... */}
Select.Item = (props) => { /*...*/ }
```
##### Doesn't work correctly with defaultProps
This is a fairly moot point as in both cases it's probably better to use ES6 default arguments, but...
```tsx
type ComponentProps = { name: string; }
const Component = ({ name }: ComponentProps) => (<div>
	{name.toUpperCase()} /* Safe since name is required */
</div>);
Component.defaultProps = { name: "John" };
const Example = () => (<Component />) /* Safe to omit since name has a default value */
```
This compiles correctly. Any approach with `React.FC` will be slightly wrong: either `React.FC<{name: string}>` will make the prop required by consumers, when it should be optional, or `React.FC<{name?: string}>` will cause `name.toUpperCase()` to be a type error. There's no way to replicate the "internally required, externally optional" behavior which is desired.
##### It's as long, or longer than the alternative: (especially longer if you use `FunctionalComponent`):
Not a huge point, but it isn't even shorter to use `React.FC` 
```ts
const C1: React.FC<CProps> = (props) => { }
const C2 = (props: CProps) => {};
```
### Benefits of React.FC
##### Provides an explicit return type
The only benefit I really see to `React.FC` (unless you think that implicit `children` is a good thing) is that it specifies the return type, which catches mistakes like:
```ts
const Component = () => {
 return undefined; // components aren't allowed to return undefined, just `null`
}
```
In practice, I think this is fine, as it'll be caught as soon as you try to use it:
```ts
const Example = () => <Component />; // Error here, due to Component returning the wrong thing
```
But even with explicit type annotations, `React.FC` still isn't saving very much boilerplate:
```ts
const Component1 = (props: ComponentProps): ReactNode => { /*...*/ }
const Component2: FC<ComponentProps> = (props) => { /*...*/ }
```
Updates dependencies and removes babel plugins that are now covered by `@babel/preset-env`.
Co-authored-by: hdineen <hdineen@hubspot.com>
alexbrazier and others added 16 commits January 31, 2020 13:36
* Add option to provide custom SSL certificates when using HTTPS
* Update documentation with custom HTTPS certs
* Improve certificate validation and move to its own file
* Update https in development docs
Co-Authored-By: Brody McKee <mrmckeb@users.noreply.github.com>
* Add custom cert example to docs
* Rename https file and update error message
* Include original error message when custom ssl cert is invalid
* Add chalk to react-scripts dependencies
* Bump docs version to say that the new config will be available in 3.2.0
* Remove chalk dependency
* Update custom ssl version to 3.4.0 in docs
* Remove version from custom ssl certificate docs
Co-authored-by: Brody McKee <mrmckeb@users.noreply.github.com>
* Handle service worker error in Firefox
See https://bugzilla.mozilla.org/show_bug.cgi?id=1429714 for more details.
* Update serviceWorker.js
Co-authored-by: Eric Clemmons <eric@smarterspam.com>
Co-authored-by: Alex Guerra <alex@heyimalex.com>
Co-authored-by: Kelly <kelly.milligan@gmail.com>
Co-authored-by: Eric Clemmons <eric@smarterspam.com>
Co-authored-by: Alex Guerra <alex@heyimalex.com>
Co-authored-by: Kelly <kelly.milligan@gmail.com>
- The JavaScript template uses a function declaration to define the component, the TypeScript template and a page of the documentation used arrow functions. Changed it to use function declarations for consistency and readability.
* Downgrade chalk for ie 11 support
* Update lockfile
...(#8442)
Moved redirect middleware and noopSW middleware in WDS after hook
So proxy, and before proxy will take precedence before redirect
Closes #8417
webpack should always be written in lower-case, according to webpack's branding guidelines https://webpack.js.org/branding 
 - cra-template-typescript@1.0.2
 - cra-template@1.0.2
 - create-react-app@3.4.0
 - react-dev-utils@10.2.0
 - react-error-overlay@6.0.6
 - react-scripts@3.4.0
Copy link

Can we please have this merged @F1LT3R

wab, jarodburchill, wdolo, Jagatmachines, maxdavidson, MikeSuiter, Linuksiarz, vsspt, jukkahuuskonen, JulianSudendorf, and ambroseus reacted with thumbs up emoji

Copy link

Any timetable for this merge? This causes quite a few problems.

Jagatmachines, bpc1985, and alanrubin reacted with thumbs up emoji

Copy link

3.3.0 has a couple of issues so it would be really good to upgrade to 3.4.0, any ideas when that will be done? Thank you very much!

@F1LT3R F1LT3R merged commit 15a0d8b into react-workspaces:master Mar 18, 2020
Copy link
Collaborator

F1LT3R commented Mar 18, 2020

@alanrubin @jukkahuuskonen @leovanhaaren @Jagatmachines ...
Merged.
Do you need me to publish to npm?

Copy link

alanrubin commented Mar 18, 2020 via email

Yes please, thank you!
...
On 2020年3月18日, 19:27 Alistair MacDonald, ***@***.***> wrote: @alanrubin <https://github.com/alanrubin> @jukkahuuskonen <https://github.com/jukkahuuskonen> @leovanhaaren <https://github.com/leovanhaaren> @Jagatmachines <https://github.com/Jagatmachines> ... Merged. Do you need me to publish to npm? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#19 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAAKDFHGMFG7DC5XXOEMHFLRIEAA5ANCNFSM4KXY4KVA> .

@vimalashik vimalashik mentioned this pull request Mar 19, 2020
Copy link

alanrubin commented Mar 23, 2020
edited
Loading

Hey, did you manage to publish it? In npm, it still shows 3.3.0-alpha-08, thanks!

Copy link

@F1LT3R can this be published to NPM please? Thanks!

joe-rocko, vsspt, saraivinha85, jakubhomoly, alanrubin, and vadzim reacted with thumbs up emoji

Copy link

jakubhomoly commented Apr 8, 2020
edited
Loading

@F1LT3R Could you please publish the new version? Thank you!

alanrubin, vadzim, and F1LT3R reacted with thumbs up emoji

Copy link
Collaborator

F1LT3R commented Apr 29, 2020

Published version @react-workspaces/react-scripts version 3.4.0-alpha-01.

FYI: Feel free to join me on Slack if you need a faster response.

https://join.slack.com/t/react-workspaces/shared_invite/zt-dx88pvp1-qUphnsiM7CmF2ll0wo_sPA

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

AltStyle によって変換されたページ (->オリジナル) /