You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
* master: (39 commits)
Added extension to .eslintrc (facebook#5988)
Update links to docs in all package README files (facebook#5912)
Use https for linked images in docs to fix mixed content warnings (facebook#5985)
Improve error messaging in verifyPackageTree.js (facebook#5974)
Add removeItem to localStorage mock in docs (facebook#5919)
Add SASS_PATH instructions to Sass docs (facebook#5917)
Suggest a different default for speed reasons (facebook#5959)
Add pre-eject message about new features in v2 (facebook#5954)
Add netlify.toml to prepare for deploy to netlify facebook#5807 (facebook#5930)
Correct some comments (facebook#5927)
Add note to docs about using Sass and Flow together (facebook#5823)
Update PWA link in README (facebook#5907)
Add placeholders to template README for bit.ly links. (facebook#5808)
Disable copy to clipboard in cra --info (facebook#5905)
Support setupTests.ts (facebook#5698)
Remove unnecessary whitespace in template HTML
Run prettier on HTML files (facebook#5839)
Some Grammar fixes (facebook#5858)
Fix link to page about running tests (facebook#5883)
fix: make typescriptformatter support 0.5 of fork checker (facebook#5879)
...
@@ -111,7 +111,7 @@ You will see the build errors and lint warnings in the console.
111
111
Runs the test watcher in an interactive mode.<br>
112
112
By default, runs tests related to files changed since the last commit.
113
113
114
-
[Read more about testing.](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#running-tests)
114
+
[Read more about testing.](https://facebook.github.io/create-react-app/docs/running-tests)
115
115
116
116
### `npm run build` or `yarn build`
117
117
@@ -134,7 +134,7 @@ Please refer to the [User Guide](https://facebook.github.io/create-react-app/doc
134
134
135
135
-**One Dependency:** There is just one build dependency. It uses Webpack, Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them.
136
136
137
-
-**No Configuration Required:** You don't need to configure anything. Reasonably good configuration of both development and production builds is handled for you so you can focus on writing code.
137
+
-**No Configuration Required:** You don't need to configure anything. A reasonably good configuration of both development and production builds is handled for you so you can focus on writing code.
138
138
139
139
-**No Lock-In:** You can “eject” to a custom setup at any time. Run a single command, and all the configuration and build dependencies will be moved directly into your project, so you can pick up right where you left off.
140
140
@@ -148,12 +148,12 @@ Your environment will have everything you need to build a modern single-page Rea
148
148
- A fast interactive unit test runner with built-in support for coverage reporting.
149
149
- A live development server that warns about common mistakes.
150
150
- A build script to bundle JS, CSS, and images for production, with hashes and sourcemaps.
151
-
- An offline-first [service worker](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers) and a [web app manifest](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/), meeting all the [Progressive Web App](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#making-a-progressive-web-app) criteria. (_Note: Using the service worker is opt-in as of `react-scripts@2.0.0` and higher_)
151
+
- An offline-first [service worker](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers) and a [web app manifest](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/), meeting all the [Progressive Web App](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app) criteria. (_Note: Using the service worker is opt-in as of `react-scripts@2.0.0` and higher_)
152
152
- Hassle-free updates for the above tools with a single dependency.
153
153
154
154
Check out [this guide](https://github.com/nitishdayal/cra_closer_look) for an overview of how these tools fit together.
155
155
156
-
The tradeoff is that **these tools are preconfigured to work in a specific way**. If your project needs more customization, you can ["eject"](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-eject) and customize it, but then you will need to maintain this configuration.
156
+
The tradeoff is that **these tools are preconfigured to work in a specific way**. If your project needs more customization, you can ["eject"](https://facebook.github.io/create-react-app/docs/available-scripts#npm-run-eject) and customize it, but then you will need to maintain this configuration.
157
157
158
158
## Popular Alternatives
159
159
@@ -163,11 +163,11 @@ Create React App is a great fit for:
163
163
-**Starting new single-page React applications.**
164
164
-**Creating examples** with React for your libraries and components.
165
165
166
-
Here’s a few common cases where you might want to try something else:
166
+
Here are few common cases where you might want to try something else:
167
167
168
168
- If you want to **try React** without hundreds of transitive build tool dependencies, consider [using a single HTML file or an online sandbox instead](https://reactjs.org/docs/try-react.html).
169
169
170
-
- If you need to **integrate React code with a server-side template framework** like Railsor Django, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker).
170
+
- If you need to **integrate React code with a server-side template framework** like Rails, Django or Symfony, or if you’re **not building a single-page app**, consider using [nwb](https://github.com/insin/nwb), or [Neutrino](https://neutrino.js.org/) which are more flexible. For Rails specifically, you can use [Rails Webpacker](https://github.com/rails/webpacker). For Symfony, try [Symfony's Webpack Encore](https://symfony.com/doc/current/frontend/encore/reactjs.html).
171
171
172
172
- If you need to **publish a React component**, [nwb](https://github.com/insin/nwb) can [also do this](https://github.com/insin/nwb#react-components-and-libraries), as well as [Neutrino's react-components preset](https://neutrino.js.org/packages/react-components/).
173
173
@@ -188,7 +188,7 @@ We'd love to have your helping hand on `create-react-app`! See [CONTRIBUTING.md]
188
188
## React Native
189
189
190
190
Looking for something similar, but for React Native?<br>
191
-
Check out [Create React Native App](https://github.com/react-community/create-react-native-app/).
191
+
Check out [Expo CLI](https://github.com/expo/expo-cli).
Copy file name to clipboardexpand all lines: docusaurus/docs/adding-a-sass-stylesheet.md
+17-3
Original file line number
Diff line number
Diff line change
@@ -30,14 +30,28 @@ This will allow you to do imports like
30
30
@import'~nprogress/nprogress'; // importing a css file from the nprogress node module
31
31
```
32
32
33
-
> **Tip:** You can opt into using this feature with [CSS modules](adding-a-css-modules-stylesheet.md) too!
34
-
35
33
> **Note:** You must prefix imports from `node_modules` with `~` as displayed above.
36
34
37
-
> **Note:** If you're using Flow, add the following to your `.flowconfig` so it'll recognize the `.sass` or `.scss` imports.
35
+
`node-sass` also supports the `SASS_PATH` variable.
36
+
37
+
To use imports relative to a path you specify, and from `node_modules` without adding the `~` prefix, you can add a [`.env` file](https://github.com/facebook/create-react-app/blob/master/docusaurus/docs/adding-custom-environment-variables.md#adding-development-environment-variables-in-env) at the project root with the variable `SASS_PATH=node_modules:src`. To specify more directories you can add them to `SASS_PATH` separated by a `:` like `path1:path2:path3`.
38
+
39
+
If you set `SASS_PATH=node_modules:src`, this will allow you to do imports like
40
+
```scss
41
+
@import'styles/colors'; // assuming a styles directory under src/, where _colors.scss partial file exists.
42
+
@import'nprogress/nprogress'; // importing a css file from the nprogress node module
43
+
```
44
+
45
+
> **Tip:** You can opt into using this feature with [CSS modules](adding-a-css-modules-stylesheet.md) too!
46
+
47
+
> **Note:** If you're using Flow, override the [module.file_ext](https://flow.org/en/docs/config/options/#toc-module-file-ext-string) setting in your `.flowconfig` so it'll recognize `.sass` or `.scss` files. You will also need to include the `module.file_ext` default settings for `.js`, `.jsx`, `.mjs` and `.json` files.
Copy file name to clipboardexpand all lines: docusaurus/docs/developing-components-in-isolation.md
+2-8
Original file line number
Diff line number
Diff line change
@@ -22,16 +22,10 @@ You can also deploy your Storybook or style guide as a static app. This way, eve
22
22
23
23
Storybook is a development environment for React UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.
24
24
25
-
First, install the following npm package globally:
25
+
Run the following command inside your app’s directory:
26
26
27
27
```sh
28
-
npm install -g @storybook/cli
29
-
```
30
-
31
-
Then, run the following command inside your app’s directory:
32
-
33
-
```sh
34
-
getstorybook
28
+
npx -p @storybook/cli sb init
35
29
```
36
30
37
31
After that, follow the instructions on the screen.
Copy file name to clipboardexpand all lines: docusaurus/docs/running-tests.md
+3-2
Original file line number
Diff line number
Diff line change
@@ -33,7 +33,7 @@ When you run `npm test`, Jest will launch in the watch mode. Every time you save
33
33
34
34
The watcher includes an interactive command-line interface with the ability to run all tests, or focus on a search pattern. It is designed this way so that you can keep it open and enjoy fast re-runs. You can learn the commands from the “Watch Usage” note that the watcher prints after every run:
0 commit comments