Skip to content

Commit

Permalink
Fix some typos (facebook#809)
Browse files Browse the repository at this point in the history
  • Loading branch information
existentialism authored and feiqitian committed Oct 25, 2016
1 parent ed2f523 commit 28ce284
Show file tree
Hide file tree
Showing 7 changed files with 34 additions and 34 deletions.
2 changes: 1 addition & 1 deletion packages/eslint-config-react-app/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

// Inspired by https://github.com/airbnb/javascript but less opinionated.

// We use eslint-loader so even warnings are very visibile.
// We use eslint-loader so even warnings are very visible.
// This is why we only use "WARNING" level for potential errors,
// and we don't use "ERROR" level at all.

Expand Down
2 changes: 1 addition & 1 deletion packages/react-dev-utils/webpackHotDevClient.js
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ function ensureOverlayDivExists(onOverlayDivReady) {
lastOnOverlayDivReady(overlayDiv);
});

// Zalgo alert: onIframeLoad() will be called either synchronouly
// Zalgo alert: onIframeLoad() will be called either synchronously
// or asynchronously depending on the browser.
// We delay adding it so `overlayIframe` is set when `onIframeLoad` fires.
document.body.appendChild(overlayIframe);
Expand Down
2 changes: 1 addition & 1 deletion packages/react-scripts/config/webpack.config.dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ var paths = require('./paths');
var publicPath = '/';
// `publicUrl` is just like `publicPath`, but we will provide it to our app
// as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
// Omit trailing shlash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
// Omit trailing slash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
var publicUrl = '';
// Get environment variables to inject into our app.
var env = getClientEnvironment(publicUrl);
Expand Down
2 changes: 1 addition & 1 deletion packages/react-scripts/scripts/build.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
// Do this as the first thing so that any code reading it knows the right env.
process.env.NODE_ENV = 'production';

// Load environment variables from .env file. Surpress warnings using silent
// Load environment variables from .env file. Suppress warnings using silent
// if this file is missing. dotenv will never modify any environment variables
// that have already been set.
// https://github.com/motdotla/dotenv
Expand Down
2 changes: 1 addition & 1 deletion packages/react-scripts/scripts/start.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

process.env.NODE_ENV = 'development';

// Load environment variables from .env file. Surpress warnings using silent
// Load environment variables from .env file. Suppress warnings using silent
// if this file is missing. dotenv will never modify any environment variables
// that have already been set.
// https://github.com/motdotla/dotenv
Expand Down
2 changes: 1 addition & 1 deletion packages/react-scripts/scripts/test.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
process.env.NODE_ENV = 'test';
process.env.PUBLIC_URL = '';

// Load environment variables from .env file. Surpress warnings using silent
// Load environment variables from .env file. Suppress warnings using silent
// if this file is missing. dotenv will never modify any environment variables
// that have already been set.
// https://github.com/motdotla/dotenv
Expand Down
56 changes: 28 additions & 28 deletions packages/react-scripts/template/README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
This project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).

Below you will find some information on how to perform common tasks.
Below you will find some information on how to perform common tasks.
You can find the most recent version of this guide [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).

## Table of Contents
Expand Down Expand Up @@ -100,13 +100,13 @@ For the project to build, **these files must exist with exact filenames**:

You can delete or rename the other files.

You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack.
You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack.
You need to **put any JS and CSS files inside `src`**, or Webpack won’t see them.

Only files inside `public` can be used from `public/index.html`.
Only files inside `public` can be used from `public/index.html`.
Read instructions below for using assets from JavaScript and HTML.

You can, however, create more top-level directories.
You can, however, create more top-level directories.
They will not be included in the production build so you can use them for things like documentation.

## Available Scripts
Expand All @@ -123,7 +123,7 @@ You will also see any lint errors in the console.

### `npm test`

Launches the test runner in the interactive watch mode.
Launches the test runner in the interactive watch mode.
See the section about [running tests](#running-tests) for more information.

### `npm run build`
Expand Down Expand Up @@ -189,7 +189,7 @@ npm install --save <library-name>

## Importing a Component

This project setup supports ES6 modules thanks to Babel.
This project setup supports ES6 modules thanks to Babel.
While you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead.

For example:
Expand Down Expand Up @@ -323,7 +323,7 @@ function Header() {
export default function Header;
```

This ensures that when the project is built, webpack will correctly move the images into the build folder, and provide us with correct paths.
This ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths.

This works in CSS too:

Expand All @@ -337,7 +337,7 @@ Webpack finds all relative module references in CSS (they start with `./`) and r

Please be advised that this is also a custom feature of Webpack.

**It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images).
**It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images).
An alternative way of handling static assets is described in the next section.

## Using the `public` Folder
Expand All @@ -362,7 +362,7 @@ Inside `index.html`, you can use it like this:

Only files inside the `public` folder will be accessible by `%PUBLIC_URL%` prefix. If you need to use a file from `src` or `node_modules`, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.

When you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.
When you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.

In JavaScript code, you can use `process.env.PUBLIC_URL` for similar purposes:

Expand Down Expand Up @@ -511,28 +511,28 @@ REACT_APP_SECRET_CODE=abcdef npm start
>Note: this feature is available with `react-scripts@0.5.0` and higher.
To define permanent environment vairables, create a file called `.env` in the root of your project:
To define permanent environment variables, create a file called `.env` in the root of your project:
```
REACT_APP_SECRET_CODE=abcdef
```
These variables will act as the defaults if the machine does not explicitly set them.
These variables will act as the defaults if the machine does not explicitly set them.
Please refer to the [dotenv documentation](https://github.com/motdotla/dotenv) for more details.
>Note: If you are defining environment variables for development, your CI and/or hosting platform will most likely need
these defined as well. Consult their documentation how to do this. For example, see the documentation for [Travis CI](https://docs.travis-ci.com/user/environment-variables/) or [Heroku](https://devcenter.heroku.com/articles/config-vars).
## Can I Use Decorators?
Many popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.
Many popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.
Create React App doesn’t support decorator syntax at the moment because:
* It is an experimental proposal and is subject to change.
* The current specification version is not officially supported by Babel.
* If the specification changes, we won’t be able to write a codemod because we don’t use them internally at Facebook.
However in many cases you can rewrite decorator-based code without decorators just as fine.
However in many cases you can rewrite decorator-based code without decorators just as fine.
Please refer to these two threads for reference:
* [#214](https://github.com/facebookincubator/create-react-app/issues/214)
Expand All @@ -548,7 +548,7 @@ Check out [this tutorial](https://www.fullstackreact.com/articles/using-create-r
>Note: this feature is available with `react-scripts@0.2.3` and higher.
People often serve the front-end React app from the same host and port as their backend implementation.
People often serve the front-end React app from the same host and port as their backend implementation.
For example, a production setup might look like this after the app is deployed:
```
Expand All @@ -575,7 +575,7 @@ Fetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-
Keep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request without a `text/html` accept header will be redirected to the specified `proxy`.
Currently the `proxy` option only handles HTTP requests, and it won’t proxy WebSocket connections.
Currently the `proxy` option only handles HTTP requests, and it won’t proxy WebSocket connections.
If the `proxy` option is **not** flexible enough for you, alternatively you can:
* Enable CORS on your server ([here’s how to do it for Express](http://enable-cors.org/server_expressjs.html)).
Expand Down Expand Up @@ -623,7 +623,7 @@ If you use a Node server, you can even share the route matching logic between th
## Running Tests
>Note: this feature is available with `[email protected]` and higher.
>Note: this feature is available with `[email protected]` and higher.
>[Read the migration guide to learn how to enable it in older projects!](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#migrating-from-023-to-030)
Create React App uses [Jest](https://facebook.github.io/jest/) as its test runner. To prepare for this integration, we did a [major revamp](https://facebook.github.io/jest/blog/2016/09/01/jest-15.html) of Jest so if you heard bad things about it years ago, give it another try.
Expand Down Expand Up @@ -677,7 +677,7 @@ it('sums numbers', () => {
});
```
All `expect()` matchers supported by Jest are [extensively documented here](http://facebook.github.io/jest/docs/api.html#expect-value).
All `expect()` matchers supported by Jest are [extensively documented here](http://facebook.github.io/jest/docs/api.html#expect-value).
You can also use [`jest.fn()` and `expect(fn).toBeCalled()`](http://facebook.github.io/jest/docs/api.html#tobecalled) to create “spies” or mock functions.
### Testing Components
Expand Down Expand Up @@ -717,7 +717,7 @@ it('renders without crashing', () => {
});
```
Unlike the previous smoke test using `ReactDOM.render()`, this test only renders `<App>` and doesn’t go deeper. For example, even if `<App>` itself renders a `<Button>` that throws, this test will pass. Shallow rendering is great for isolated unit tests, but you may still want to create some full rendering tests to ensure the components integrate correctly. Enzyme supports [full rendering with `mount()`](http://airbnb.io/enzyme/docs/api/mount.html), and you can also use it for testing state changes and component lifecyle.
Unlike the previous smoke test using `ReactDOM.render()`, this test only renders `<App>` and doesn’t go deeper. For example, even if `<App>` itself renders a `<Button>` that throws, this test will pass. Shallow rendering is great for isolated unit tests, but you may still want to create some full rendering tests to ensure the components integrate correctly. Enzyme supports [full rendering with `mount()`](http://airbnb.io/enzyme/docs/api/mount.html), and you can also use it for testing state changes and component lifecycle.
You can read the [Enzyme documentation](http://airbnb.io/enzyme/) for more testing techniques. Enzyme documentation uses Chai and Sinon for assertions but you don’t have to use them because Jest provides built-in `expect()` and `jest.fn()` for spies.
Expand All @@ -736,8 +736,8 @@ it('renders welcome message', () => {
});
```
All Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/api.html#expect-value).
Nevertheless you can use a third-party assertion library like Chai if you want to, as described below.
All Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/api.html#expect-value).
Nevertheless you can use a third-party assertion library like [Chai](http://chaijs.com/) if you want to, as described below.
### Using Third Party Assertion Libraries
Expand Down Expand Up @@ -772,12 +772,12 @@ global.localStorage = localStorageMock
### Focusing and Excluding Tests
You can replace `it()` with `xit()` to temporarily exclude a test from being executed.
You can replace `it()` with `xit()` to temporarily exclude a test from being executed.
Similarly, `fit()` lets you focus on a specific test without running any other tests.
### Coverage Reporting
Jest has an integrated coverage reporter that works well with ES6 and requires no configuration.
Jest has an integrated coverage reporter that works well with ES6 and requires no configuration.
Run `npm test -- --coverage` (note extra `--` in the middle) to include a coverage report like this:
![coverage report](http://i.imgur.com/5bFhnTS.png)
Expand All @@ -791,7 +791,7 @@ By default `npm test` runs the watcher with interactive CLI. However, you can fo
### On CI servers
#### Travis CI
1. Following the [Travis Getting started](https://docs.travis-ci.com/user/getting-started/) guide for syncing your Github repository with Travis. You may need to initialize some settings manually in your [profile](https://travis-ci.org/profile) page.
1. Following the [Travis Getting started](https://docs.travis-ci.com/user/getting-started/) guide for syncing your GitHub repository with Travis. You may need to initialize some settings manually in your [profile](https://travis-ci.org/profile) page.
1. Add a `.travis.yml` file to your git repository.
```
language: node_js
Expand Down Expand Up @@ -838,7 +838,7 @@ By default, the `package.json` of the generated project looks like this:
}
```
If you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster.
If you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster.
To help you make up your mind, here is a list of APIs that **need jsdom**:
* Any browser globals like `window` and `document`
Expand All @@ -863,7 +863,7 @@ This feature is experimental and still [has major usage issues](https://github.c
## Building for Relative Paths
By default, Create React App produces a build assuming your app is hosted at the server root.
By default, Create React App produces a build assuming your app is hosted at the server root.
To override this, specify the `homepage` in your `package.json`, for example:
```js
Expand All @@ -882,7 +882,7 @@ Open your `package.json` and add a `homepage` field:
"homepage": "http://myusername.github.io/my-app",
```
**The above step is important!**
**The above step is important!**
Create React App uses the `homepage` field to determine the root URL in the built HTML file.
Now, whenever you run `npm run build`, you will see a cheat sheet with a sequence of commands to deploy to GitHub pages:
Expand All @@ -905,7 +905,7 @@ Note that GitHub Pages doesn't support routers that use the HTML5 `pushState` hi
### Heroku
Use the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack).
Use the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack).
You can find instructions in [Deploying React with Zero Configuration](https://blog.heroku.com/deploying-react-with-zero-configuration).
### Modulus
Expand Down Expand Up @@ -964,7 +964,7 @@ Install the Surge CLI if you haven't already by running `npm install -g surge`.
Success! Project is published and running at create-react-app.surge.sh
```
Note that in order to support routers that use html5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).
Note that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).
## Something Missing?
Expand Down

0 comments on commit 28ce284

Please sign in to comment.