mirror of
https://github.com/zhigang1992/create-react-app.git
synced 2026-06-10 15:29:16 +08:00
Ian Sutherland
File diff suppressed because one or more lines are too long
@@ -139,6 +139,9 @@
|
||||
<blockquote>
|
||||
<p>Note: You must create custom environment variables beginning with <code>REACT_APP_</code>. Any other variables except <code>NODE_ENV</code> will be ignored to avoid <a href="https://github.com/facebook/create-react-app/issues/865#issuecomment-252199527">accidentally exposing a private key on the machine that could have the same name</a>. Changing any environment variables will require you to restart the development server if it is running.</p>
|
||||
</blockquote>
|
||||
<blockquote>
|
||||
<p>Note: You need to restart the development server after changing <code>.env</code> files.</p>
|
||||
</blockquote>
|
||||
<p><code>.env</code> files <strong>should be</strong> checked into source control (with the exclusion of <code>.env*.local</code>).</p>
|
||||
<h3><a class="anchor" aria-hidden="true" id="what-other-env-files-can-be-used"></a><a href="#what-other-env-files-can-be-used" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>What other <code>.env</code> files can be used?</h3>
|
||||
<blockquote>
|
||||
@@ -177,7 +180,7 @@ these defined as well. Consult their documentation how to do this. For example,
|
||||
<span class="hljs-attr">REACT_APP_FOO</span>=<span class="hljs-variable">$DOMAIN</span>/foo
|
||||
<span class="hljs-attr">REACT_APP_BAR</span>=<span class="hljs-variable">$DOMAIN</span>/bar
|
||||
</code></pre>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 3/9/2019 by JBallin</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-a-router"><span class="arrow-prev">← </span><span>Adding a Router</span></a><a class="docs-next button" href="/create-react-app/docs/making-a-progressive-web-app"><span>Making a Progressive Web App</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#referencing-environment-variables-in-the-html">Referencing Environment Variables in the HTML</a></li><li><a href="#adding-temporary-environment-variables-in-your-shell">Adding Temporary Environment Variables In Your Shell</a><ul class="toc-headings"><li><a href="#windows-cmdexe">Windows (cmd.exe)</a></li><li><a href="#windows-powershell">Windows (Powershell)</a></li><li><a href="#linux-macos-bash">Linux, macOS (Bash)</a></li></ul></li><li><a href="#adding-development-environment-variables-in-env">Adding Development Environment Variables In <code>.env</code></a><ul class="toc-headings"><li><a href="#what-other-env-files-can-be-used">What other <code>.env</code> files can be used?</a></li><li><a href="#expanding-environment-variables-in-env">Expanding Environment Variables In <code>.env</code></a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 5/5/2019 by Mostafa Nawara</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-a-router"><span class="arrow-prev">← </span><span>Adding a Router</span></a><a class="docs-next button" href="/create-react-app/docs/making-a-progressive-web-app"><span>Making a Progressive Web App</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#referencing-environment-variables-in-the-html">Referencing Environment Variables in the HTML</a></li><li><a href="#adding-temporary-environment-variables-in-your-shell">Adding Temporary Environment Variables In Your Shell</a><ul class="toc-headings"><li><a href="#windows-cmdexe">Windows (cmd.exe)</a></li><li><a href="#windows-powershell">Windows (Powershell)</a></li><li><a href="#linux-macos-bash">Linux, macOS (Bash)</a></li></ul></li><li><a href="#adding-development-environment-variables-in-env">Adding Development Environment Variables In <code>.env</code></a><ul class="toc-headings"><li><a href="#what-other-env-files-can-be-used">What other <code>.env</code> files can be used?</a></li><li><a href="#expanding-environment-variables-in-env">Expanding Environment Variables In <code>.env</code></a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -139,6 +139,9 @@
|
||||
<blockquote>
|
||||
<p>Note: You must create custom environment variables beginning with <code>REACT_APP_</code>. Any other variables except <code>NODE_ENV</code> will be ignored to avoid <a href="https://github.com/facebook/create-react-app/issues/865#issuecomment-252199527">accidentally exposing a private key on the machine that could have the same name</a>. Changing any environment variables will require you to restart the development server if it is running.</p>
|
||||
</blockquote>
|
||||
<blockquote>
|
||||
<p>Note: You need to restart the development server after changing <code>.env</code> files.</p>
|
||||
</blockquote>
|
||||
<p><code>.env</code> files <strong>should be</strong> checked into source control (with the exclusion of <code>.env*.local</code>).</p>
|
||||
<h3><a class="anchor" aria-hidden="true" id="what-other-env-files-can-be-used"></a><a href="#what-other-env-files-can-be-used" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>What other <code>.env</code> files can be used?</h3>
|
||||
<blockquote>
|
||||
@@ -177,7 +180,7 @@ these defined as well. Consult their documentation how to do this. For example,
|
||||
<span class="hljs-attr">REACT_APP_FOO</span>=<span class="hljs-variable">$DOMAIN</span>/foo
|
||||
<span class="hljs-attr">REACT_APP_BAR</span>=<span class="hljs-variable">$DOMAIN</span>/bar
|
||||
</code></pre>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 3/9/2019 by JBallin</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-a-router"><span class="arrow-prev">← </span><span>Adding a Router</span></a><a class="docs-next button" href="/create-react-app/docs/making-a-progressive-web-app"><span>Making a Progressive Web App</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#referencing-environment-variables-in-the-html">Referencing Environment Variables in the HTML</a></li><li><a href="#adding-temporary-environment-variables-in-your-shell">Adding Temporary Environment Variables In Your Shell</a><ul class="toc-headings"><li><a href="#windows-cmdexe">Windows (cmd.exe)</a></li><li><a href="#windows-powershell">Windows (Powershell)</a></li><li><a href="#linux-macos-bash">Linux, macOS (Bash)</a></li></ul></li><li><a href="#adding-development-environment-variables-in-env">Adding Development Environment Variables In <code>.env</code></a><ul class="toc-headings"><li><a href="#what-other-env-files-can-be-used">What other <code>.env</code> files can be used?</a></li><li><a href="#expanding-environment-variables-in-env">Expanding Environment Variables In <code>.env</code></a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 5/5/2019 by Mostafa Nawara</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-a-router"><span class="arrow-prev">← </span><span>Adding a Router</span></a><a class="docs-next button" href="/create-react-app/docs/making-a-progressive-web-app"><span>Making a Progressive Web App</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#referencing-environment-variables-in-the-html">Referencing Environment Variables in the HTML</a></li><li><a href="#adding-temporary-environment-variables-in-your-shell">Adding Temporary Environment Variables In Your Shell</a><ul class="toc-headings"><li><a href="#windows-cmdexe">Windows (cmd.exe)</a></li><li><a href="#windows-powershell">Windows (Powershell)</a></li><li><a href="#linux-macos-bash">Linux, macOS (Bash)</a></li></ul></li><li><a href="#adding-development-environment-variables-in-env">Adding Development Environment Variables In <code>.env</code></a><ul class="toc-headings"><li><a href="#what-other-env-files-can-be-used">What other <code>.env</code> files can be used?</a></li><li><a href="#expanding-environment-variables-in-env">Expanding Environment Variables In <code>.env</code></a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -71,6 +71,9 @@
|
||||
|
||||
yarn create react-app my-app --typescript
|
||||
</code></pre>
|
||||
<blockquote>
|
||||
<p>If you've previously installed <code>create-react-app</code> globally via <code>npm install -g create-react-app</code>, we recommend you uninstall the package using <code>npm uninstall -g create-react-app</code> to ensure that <code>npx</code> always uses the latest version.</p>
|
||||
</blockquote>
|
||||
<p>To add <a href="https://www.typescriptlang.org/">TypeScript</a> to a Create React App project, first install it:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save typescript @types/node @types/react @types/react-dom @types/jest
|
||||
|
||||
@@ -98,7 +101,7 @@ You are allowed to edit the generated TypeScript configuration.</p>
|
||||
<blockquote>
|
||||
<p><strong>Note:</strong> Constant enums and namespaces are not supported.</p>
|
||||
</blockquote>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 3/12/2019 by Taylor Briggs</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-flow"><span class="arrow-prev">← </span><span>Adding Flow</span></a><a class="docs-next button" href="/create-react-app/docs/adding-relay"><span>Adding Relay</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/30/2019 by Chris Shaffer</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-flow"><span class="arrow-prev">← </span><span>Adding Flow</span></a><a class="docs-next button" href="/create-react-app/docs/adding-relay"><span>Adding Relay</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -71,6 +71,9 @@
|
||||
|
||||
yarn create react-app my-app --typescript
|
||||
</code></pre>
|
||||
<blockquote>
|
||||
<p>If you've previously installed <code>create-react-app</code> globally via <code>npm install -g create-react-app</code>, we recommend you uninstall the package using <code>npm uninstall -g create-react-app</code> to ensure that <code>npx</code> always uses the latest version.</p>
|
||||
</blockquote>
|
||||
<p>To add <a href="https://www.typescriptlang.org/">TypeScript</a> to a Create React App project, first install it:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save typescript @types/node @types/react @types/react-dom @types/jest
|
||||
|
||||
@@ -98,7 +101,7 @@ You are allowed to edit the generated TypeScript configuration.</p>
|
||||
<blockquote>
|
||||
<p><strong>Note:</strong> Constant enums and namespaces are not supported.</p>
|
||||
</blockquote>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 3/12/2019 by Taylor Briggs</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-flow"><span class="arrow-prev">← </span><span>Adding Flow</span></a><a class="docs-next button" href="/create-react-app/docs/adding-relay"><span>Adding Relay</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/30/2019 by Chris Shaffer</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-flow"><span class="arrow-prev">← </span><span>Adding Flow</span></a><a class="docs-next button" href="/create-react-app/docs/adding-relay"><span>Adding Relay</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -112,7 +112,7 @@ service worker navigation routing can be configured or disabled by
|
||||
<a href="/create-react-app/docs/available-scripts#npm-run-eject"><code>eject</code>ing</a> and then modifying the
|
||||
<a href="https://github.com/GoogleChrome/sw-precache#navigatefallback-string"><code>navigateFallback</code></a>
|
||||
and <a href="https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp"><code>navigateFallbackWhitelist</code></a>
|
||||
options of the <code>SWPreachePlugin</code> <a href="../config/webpack.config.prod.js">configuration</a>.</p>
|
||||
options of the <code>SWPrecachePlugin</code> <a href="../config/webpack.config.prod.js">configuration</a>.</p>
|
||||
<p>When users install your app to the homescreen of their device the default configuration will make a shortcut to <code>/index.html</code>. This may not work for client-side routers which expect the app to be served from <code>/</code>. Edit the web app manifest at <a href="public/manifest.json"><code>public/manifest.json</code></a> and change <code>start_url</code> to match the required URL scheme, for example:</p>
|
||||
<pre><code class="hljs css language-js"> <span class="hljs-string">"start_url"</span>: <span class="hljs-string">"."</span>,
|
||||
</code></pre>
|
||||
@@ -376,7 +376,7 @@ netlify deploy
|
||||
<p>Note that in order to support routers that use HTML5 <code>pushState</code> API, you may want to rename the <code>index.html</code> in your build folder to <code>200.html</code> before deploying to Surge. This <a href="https://surge.sh/help/adding-a-200-page-for-client-side-routing">ensures that every URL falls back to that file</a>.</p>
|
||||
<h2><a class="anchor" aria-hidden="true" id="publishing-components-to-npm"></a><a href="#publishing-components-to-npm" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Publishing Components To npm</h2>
|
||||
<p>Create React App doesn't provide any built-in functionality to publish a component to npm. If you're ready to extract a component from your project so other people can use it, we recommend moving it to a separate directory outside of your project and then using a tool like <a href="https://github.com/insin/nwb#react-components-and-libraries">nwb</a> to prepare it for publishing.</p>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/16/2019 by Robert van Steen</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/title-and-meta-tags"><span class="arrow-prev">← </span><span>Title & Meta Tags</span></a><a class="docs-next button" href="/create-react-app/docs/can-i-use-decorators"><span>Can I Use Decorators?</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#static-server">Static Server</a></li><li><a href="#other-solutions">Other Solutions</a></li><li><a href="#serving-apps-with-client-side-routing">Serving Apps with Client-Side Routing</a></li><li><a href="#building-for-relative-paths">Building for Relative Paths</a><ul class="toc-headings"><li><a href="#serving-the-same-build-from-different-paths">Serving the Same Build from Different Paths</a></li></ul></li><li><a href="#customizing-environment-variables-for-arbitrary-build-environments">Customizing Environment Variables for Arbitrary Build Environments</a></li><li><a href="#aws-amplify-http-consoleamplifyaws">AWS Amplify</a></li><li><a href="#azure-https-azuremicrosoftcom">Azure</a></li><li><a href="#firebase-https-firebasegooglecom">Firebase</a></li><li><a href="#github-pages-https-pagesgithubcom">GitHub Pages</a><ul class="toc-headings"><li><a href="#step-1-add-homepage-to-packagejson">Step 1: Add <code>homepage</code> to <code>package.json</code></a></li><li><a href="#step-2-install-gh-pages-and-add-deploy-to-scripts-in-packagejson">Step 2: Install <code>gh-pages</code> and add <code>deploy</code> to <code>scripts</code> in <code>package.json</code></a></li><li><a href="#step-3-deploy-the-site-by-running-npm-run-deploy">Step 3: Deploy the site by running <code>npm run deploy</code></a></li><li><a href="#step-4-for-a-project-page-ensure-your-project-s-settings-use-gh-pages">Step 4: For a project page, ensure your project’s settings use <code>gh-pages</code></a></li><li><a href="#step-5-optionally-configure-the-domain">Step 5: Optionally, configure the domain</a></li><li><a href="#notes-on-client-side-routing">Notes on client-side routing</a></li><li><a href="#troubleshooting">Troubleshooting</a></li></ul></li><li><a href="#heroku-https-wwwherokucom">Heroku</a><ul class="toc-headings"><li><a href="#resolving-heroku-deployment-errors">Resolving Heroku Deployment Errors</a></li></ul></li><li><a href="#netlify-https-wwwnetlifycom">Netlify</a></li><li><a href="#now-https-zeitco-now">Now</a></li><li><a href="#render-https-rendercom">Render</a></li><li><a href="#s3-https-awsamazoncom-s3-and-cloudfront-https-awsamazoncom-cloudfront">S3</a></li><li><a href="#surge-https-surgesh">Surge</a></li><li><a href="#publishing-components-to-npm">Publishing Components To npm</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/24/2019 by David Cho-Lerat</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/title-and-meta-tags"><span class="arrow-prev">← </span><span>Title & Meta Tags</span></a><a class="docs-next button" href="/create-react-app/docs/can-i-use-decorators"><span>Can I Use Decorators?</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#static-server">Static Server</a></li><li><a href="#other-solutions">Other Solutions</a></li><li><a href="#serving-apps-with-client-side-routing">Serving Apps with Client-Side Routing</a></li><li><a href="#building-for-relative-paths">Building for Relative Paths</a><ul class="toc-headings"><li><a href="#serving-the-same-build-from-different-paths">Serving the Same Build from Different Paths</a></li></ul></li><li><a href="#customizing-environment-variables-for-arbitrary-build-environments">Customizing Environment Variables for Arbitrary Build Environments</a></li><li><a href="#aws-amplify-http-consoleamplifyaws">AWS Amplify</a></li><li><a href="#azure-https-azuremicrosoftcom">Azure</a></li><li><a href="#firebase-https-firebasegooglecom">Firebase</a></li><li><a href="#github-pages-https-pagesgithubcom">GitHub Pages</a><ul class="toc-headings"><li><a href="#step-1-add-homepage-to-packagejson">Step 1: Add <code>homepage</code> to <code>package.json</code></a></li><li><a href="#step-2-install-gh-pages-and-add-deploy-to-scripts-in-packagejson">Step 2: Install <code>gh-pages</code> and add <code>deploy</code> to <code>scripts</code> in <code>package.json</code></a></li><li><a href="#step-3-deploy-the-site-by-running-npm-run-deploy">Step 3: Deploy the site by running <code>npm run deploy</code></a></li><li><a href="#step-4-for-a-project-page-ensure-your-project-s-settings-use-gh-pages">Step 4: For a project page, ensure your project’s settings use <code>gh-pages</code></a></li><li><a href="#step-5-optionally-configure-the-domain">Step 5: Optionally, configure the domain</a></li><li><a href="#notes-on-client-side-routing">Notes on client-side routing</a></li><li><a href="#troubleshooting">Troubleshooting</a></li></ul></li><li><a href="#heroku-https-wwwherokucom">Heroku</a><ul class="toc-headings"><li><a href="#resolving-heroku-deployment-errors">Resolving Heroku Deployment Errors</a></li></ul></li><li><a href="#netlify-https-wwwnetlifycom">Netlify</a></li><li><a href="#now-https-zeitco-now">Now</a></li><li><a href="#render-https-rendercom">Render</a></li><li><a href="#s3-https-awsamazoncom-s3-and-cloudfront-https-awsamazoncom-cloudfront">S3</a></li><li><a href="#surge-https-surgesh">Surge</a></li><li><a href="#publishing-components-to-npm">Publishing Components To npm</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -112,7 +112,7 @@ service worker navigation routing can be configured or disabled by
|
||||
<a href="/create-react-app/docs/available-scripts#npm-run-eject"><code>eject</code>ing</a> and then modifying the
|
||||
<a href="https://github.com/GoogleChrome/sw-precache#navigatefallback-string"><code>navigateFallback</code></a>
|
||||
and <a href="https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp"><code>navigateFallbackWhitelist</code></a>
|
||||
options of the <code>SWPreachePlugin</code> <a href="../config/webpack.config.prod.js">configuration</a>.</p>
|
||||
options of the <code>SWPrecachePlugin</code> <a href="../config/webpack.config.prod.js">configuration</a>.</p>
|
||||
<p>When users install your app to the homescreen of their device the default configuration will make a shortcut to <code>/index.html</code>. This may not work for client-side routers which expect the app to be served from <code>/</code>. Edit the web app manifest at <a href="public/manifest.json"><code>public/manifest.json</code></a> and change <code>start_url</code> to match the required URL scheme, for example:</p>
|
||||
<pre><code class="hljs css language-js"> <span class="hljs-string">"start_url"</span>: <span class="hljs-string">"."</span>,
|
||||
</code></pre>
|
||||
@@ -376,7 +376,7 @@ netlify deploy
|
||||
<p>Note that in order to support routers that use HTML5 <code>pushState</code> API, you may want to rename the <code>index.html</code> in your build folder to <code>200.html</code> before deploying to Surge. This <a href="https://surge.sh/help/adding-a-200-page-for-client-side-routing">ensures that every URL falls back to that file</a>.</p>
|
||||
<h2><a class="anchor" aria-hidden="true" id="publishing-components-to-npm"></a><a href="#publishing-components-to-npm" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Publishing Components To npm</h2>
|
||||
<p>Create React App doesn't provide any built-in functionality to publish a component to npm. If you're ready to extract a component from your project so other people can use it, we recommend moving it to a separate directory outside of your project and then using a tool like <a href="https://github.com/insin/nwb#react-components-and-libraries">nwb</a> to prepare it for publishing.</p>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/16/2019 by Robert van Steen</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/title-and-meta-tags"><span class="arrow-prev">← </span><span>Title & Meta Tags</span></a><a class="docs-next button" href="/create-react-app/docs/can-i-use-decorators"><span>Can I Use Decorators?</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#static-server">Static Server</a></li><li><a href="#other-solutions">Other Solutions</a></li><li><a href="#serving-apps-with-client-side-routing">Serving Apps with Client-Side Routing</a></li><li><a href="#building-for-relative-paths">Building for Relative Paths</a><ul class="toc-headings"><li><a href="#serving-the-same-build-from-different-paths">Serving the Same Build from Different Paths</a></li></ul></li><li><a href="#customizing-environment-variables-for-arbitrary-build-environments">Customizing Environment Variables for Arbitrary Build Environments</a></li><li><a href="#aws-amplify-http-consoleamplifyaws">AWS Amplify</a></li><li><a href="#azure-https-azuremicrosoftcom">Azure</a></li><li><a href="#firebase-https-firebasegooglecom">Firebase</a></li><li><a href="#github-pages-https-pagesgithubcom">GitHub Pages</a><ul class="toc-headings"><li><a href="#step-1-add-homepage-to-packagejson">Step 1: Add <code>homepage</code> to <code>package.json</code></a></li><li><a href="#step-2-install-gh-pages-and-add-deploy-to-scripts-in-packagejson">Step 2: Install <code>gh-pages</code> and add <code>deploy</code> to <code>scripts</code> in <code>package.json</code></a></li><li><a href="#step-3-deploy-the-site-by-running-npm-run-deploy">Step 3: Deploy the site by running <code>npm run deploy</code></a></li><li><a href="#step-4-for-a-project-page-ensure-your-project-s-settings-use-gh-pages">Step 4: For a project page, ensure your project’s settings use <code>gh-pages</code></a></li><li><a href="#step-5-optionally-configure-the-domain">Step 5: Optionally, configure the domain</a></li><li><a href="#notes-on-client-side-routing">Notes on client-side routing</a></li><li><a href="#troubleshooting">Troubleshooting</a></li></ul></li><li><a href="#heroku-https-wwwherokucom">Heroku</a><ul class="toc-headings"><li><a href="#resolving-heroku-deployment-errors">Resolving Heroku Deployment Errors</a></li></ul></li><li><a href="#netlify-https-wwwnetlifycom">Netlify</a></li><li><a href="#now-https-zeitco-now">Now</a></li><li><a href="#render-https-rendercom">Render</a></li><li><a href="#s3-https-awsamazoncom-s3-and-cloudfront-https-awsamazoncom-cloudfront">S3</a></li><li><a href="#surge-https-surgesh">Surge</a></li><li><a href="#publishing-components-to-npm">Publishing Components To npm</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/24/2019 by David Cho-Lerat</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/title-and-meta-tags"><span class="arrow-prev">← </span><span>Title & Meta Tags</span></a><a class="docs-next button" href="/create-react-app/docs/can-i-use-decorators"><span>Can I Use Decorators?</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#static-server">Static Server</a></li><li><a href="#other-solutions">Other Solutions</a></li><li><a href="#serving-apps-with-client-side-routing">Serving Apps with Client-Side Routing</a></li><li><a href="#building-for-relative-paths">Building for Relative Paths</a><ul class="toc-headings"><li><a href="#serving-the-same-build-from-different-paths">Serving the Same Build from Different Paths</a></li></ul></li><li><a href="#customizing-environment-variables-for-arbitrary-build-environments">Customizing Environment Variables for Arbitrary Build Environments</a></li><li><a href="#aws-amplify-http-consoleamplifyaws">AWS Amplify</a></li><li><a href="#azure-https-azuremicrosoftcom">Azure</a></li><li><a href="#firebase-https-firebasegooglecom">Firebase</a></li><li><a href="#github-pages-https-pagesgithubcom">GitHub Pages</a><ul class="toc-headings"><li><a href="#step-1-add-homepage-to-packagejson">Step 1: Add <code>homepage</code> to <code>package.json</code></a></li><li><a href="#step-2-install-gh-pages-and-add-deploy-to-scripts-in-packagejson">Step 2: Install <code>gh-pages</code> and add <code>deploy</code> to <code>scripts</code> in <code>package.json</code></a></li><li><a href="#step-3-deploy-the-site-by-running-npm-run-deploy">Step 3: Deploy the site by running <code>npm run deploy</code></a></li><li><a href="#step-4-for-a-project-page-ensure-your-project-s-settings-use-gh-pages">Step 4: For a project page, ensure your project’s settings use <code>gh-pages</code></a></li><li><a href="#step-5-optionally-configure-the-domain">Step 5: Optionally, configure the domain</a></li><li><a href="#notes-on-client-side-routing">Notes on client-side routing</a></li><li><a href="#troubleshooting">Troubleshooting</a></li></ul></li><li><a href="#heroku-https-wwwherokucom">Heroku</a><ul class="toc-headings"><li><a href="#resolving-heroku-deployment-errors">Resolving Heroku Deployment Errors</a></li></ul></li><li><a href="#netlify-https-wwwnetlifycom">Netlify</a></li><li><a href="#now-https-zeitco-now">Now</a></li><li><a href="#render-https-rendercom">Render</a></li><li><a href="#s3-https-awsamazoncom-s3-and-cloudfront-https-awsamazoncom-cloudfront">S3</a></li><li><a href="#surge-https-surgesh">Surge</a></li><li><a href="#publishing-components-to-npm">Publishing Components To npm</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Loading .graphql Files · Create React App</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
"/><meta name="docsearch:language" content="en"/><meta property="og:title" content="Loading .graphql Files · Create React App"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/create-react-app/index.html"/><meta property="og:description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Loading .graphql Files · Create React App</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
"/><meta name="docsearch:language" content="en"/><meta property="og:title" content="Loading .graphql Files · Create React App"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/create-react-app/index.html"/><meta property="og:description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
"/><meta property="og:image" content="https://facebook.github.io/create-react-app/img/logo-og.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://facebook.github.io/create-react-app/img/logo-og.png"/><link rel="shortcut icon" href="/create-react-app/img/favicon/favicon.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css"/><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
addBackToTop(
|
||||
@@ -56,11 +56,11 @@
|
||||
};
|
||||
}
|
||||
});
|
||||
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/create-react-app/edit/master/docusaurus/docs/loading-graphql-files.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Loading .graphql Files</h1></header><article><div><span><p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save graphql.macro
|
||||
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/create-react-app/edit/master/docusaurus/docs/loading-graphql-files.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Loading .graphql Files</h1></header><article><div><span><p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save graphql graphql.macro
|
||||
</code></pre>
|
||||
<p>Alternatively you may use <code>yarn</code>:</p>
|
||||
<pre><code class="hljs css language-sh">yarn add graphql.macro
|
||||
<pre><code class="hljs css language-sh">yarn add graphql graphql.macro
|
||||
</code></pre>
|
||||
<p>Then, whenever you want to load <code>.gql</code> or <code>.graphql</code> files, import the <code>loader</code> from the macro package:</p>
|
||||
<pre><code class="hljs css language-js"><span class="hljs-keyword">import</span> { loader } <span class="hljs-keyword">from</span> <span class="hljs-string">'graphql.macro'</span>;
|
||||
@@ -68,13 +68,11 @@
|
||||
<span class="hljs-keyword">const</span> query = loader(<span class="hljs-string">'./foo.graphql'</span>);
|
||||
</code></pre>
|
||||
<p>And your results get automatically inlined! This means that if the file above, <code>foo.graphql</code>, contains the following:</p>
|
||||
<pre><code class="hljs css language-graphql">gql`
|
||||
query {
|
||||
hello {
|
||||
world
|
||||
}
|
||||
<pre><code class="hljs css language-graphql"><span class="hljs-section">query</span> {
|
||||
<span class="hljs-section">hello</span> {
|
||||
<span class="hljs-attribute">world</span>
|
||||
}
|
||||
`;
|
||||
}
|
||||
</code></pre>
|
||||
<p>The previous example turns into:</p>
|
||||
<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> query = {
|
||||
@@ -104,7 +102,7 @@
|
||||
}
|
||||
`</span>;
|
||||
</code></pre>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/3/2019 by Pete Nykänen</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-images-fonts-and-files"><span class="arrow-prev">← </span><span>Adding Images, Fonts, and Files</span></a><a class="docs-next button" href="/create-react-app/docs/using-the-public-folder"><span>Using the Public Folder</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/29/2019 by nagman</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-images-fonts-and-files"><span class="arrow-prev">← </span><span>Adding Images, Fonts, and Files</span></a><a class="docs-next button" href="/create-react-app/docs/using-the-public-folder"><span>Using the Public Folder</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Loading .graphql Files · Create React App</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
"/><meta name="docsearch:language" content="en"/><meta property="og:title" content="Loading .graphql Files · Create React App"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/create-react-app/index.html"/><meta property="og:description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Loading .graphql Files · Create React App</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
"/><meta name="docsearch:language" content="en"/><meta property="og:title" content="Loading .graphql Files · Create React App"/><meta property="og:type" content="website"/><meta property="og:url" content="https://facebook.github.io/create-react-app/index.html"/><meta property="og:description" content="<p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
"/><meta property="og:image" content="https://facebook.github.io/create-react-app/img/logo-og.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://facebook.github.io/create-react-app/img/logo-og.png"/><link rel="shortcut icon" href="/create-react-app/img/favicon/favicon.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css"/><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
addBackToTop(
|
||||
@@ -56,11 +56,11 @@
|
||||
};
|
||||
}
|
||||
});
|
||||
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/create-react-app/edit/master/docusaurus/docs/loading-graphql-files.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Loading .graphql Files</h1></header><article><div><span><p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> package by running:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save graphql.macro
|
||||
</script></nav></div><div class="container mainContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://github.com/facebook/create-react-app/edit/master/docusaurus/docs/loading-graphql-files.md" target="_blank" rel="noreferrer noopener">Edit</a><h1 class="postHeaderTitle">Loading .graphql Files</h1></header><article><div><span><p>To load <code>.gql</code> and <code>.graphql</code> files, first install the <a href="https://www.npmjs.com/package/graphql"><code>graphql</code></a> and <a href="https://www.npmjs.com/package/graphql.macro"><code>graphql.macro</code></a> packages by running:</p>
|
||||
<pre><code class="hljs css language-sh">npm install --save graphql graphql.macro
|
||||
</code></pre>
|
||||
<p>Alternatively you may use <code>yarn</code>:</p>
|
||||
<pre><code class="hljs css language-sh">yarn add graphql.macro
|
||||
<pre><code class="hljs css language-sh">yarn add graphql graphql.macro
|
||||
</code></pre>
|
||||
<p>Then, whenever you want to load <code>.gql</code> or <code>.graphql</code> files, import the <code>loader</code> from the macro package:</p>
|
||||
<pre><code class="hljs css language-js"><span class="hljs-keyword">import</span> { loader } <span class="hljs-keyword">from</span> <span class="hljs-string">'graphql.macro'</span>;
|
||||
@@ -68,13 +68,11 @@
|
||||
<span class="hljs-keyword">const</span> query = loader(<span class="hljs-string">'./foo.graphql'</span>);
|
||||
</code></pre>
|
||||
<p>And your results get automatically inlined! This means that if the file above, <code>foo.graphql</code>, contains the following:</p>
|
||||
<pre><code class="hljs css language-graphql">gql`
|
||||
query {
|
||||
hello {
|
||||
world
|
||||
}
|
||||
<pre><code class="hljs css language-graphql"><span class="hljs-section">query</span> {
|
||||
<span class="hljs-section">hello</span> {
|
||||
<span class="hljs-attribute">world</span>
|
||||
}
|
||||
`;
|
||||
}
|
||||
</code></pre>
|
||||
<p>The previous example turns into:</p>
|
||||
<pre><code class="hljs css language-javascript"><span class="hljs-keyword">const</span> query = {
|
||||
@@ -104,7 +102,7 @@
|
||||
}
|
||||
`</span>;
|
||||
</code></pre>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/3/2019 by Pete Nykänen</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-images-fonts-and-files"><span class="arrow-prev">← </span><span>Adding Images, Fonts, and Files</span></a><a class="docs-next button" href="/create-react-app/docs/using-the-public-folder"><span>Using the Public Folder</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/29/2019 by nagman</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/adding-images-fonts-and-files"><span class="arrow-prev">← </span><span>Adding Images, Fonts, and Files</span></a><a class="docs-next button" href="/create-react-app/docs/using-the-public-folder"><span>Using the Public Folder</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -95,7 +95,7 @@
|
||||
<blockquote>
|
||||
<p>When editing the <code>browerslist</code> config, you may notice that your changes don't get picked up right away. This is due to an <a href="https://github.com/babel/babel-loader/issues/690">issue in babel-loader</a> not detecting the change in your <code>package.json</code>. An easy solution is to delete the <code>node_modules/.cache</code> folder and try again.</p>
|
||||
</blockquote>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/14/2019 by Ian Schmitz</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/available-scripts"><span class="arrow-prev">← </span><span>Available Scripts</span></a><a class="docs-next button" href="/create-react-app/docs/updating-to-new-releases"><span>Updating to New Releases</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#supported-browsers">Supported Browsers</a></li><li><a href="#supported-language-features">Supported Language Features</a></li><li><a href="#configuring-supported-browsers">Configuring Supported Browsers</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 5/8/2019 by Ian Sutherland</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/available-scripts"><span class="arrow-prev">← </span><span>Available Scripts</span></a><a class="docs-next button" href="/create-react-app/docs/updating-to-new-releases"><span>Updating to New Releases</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#supported-browsers">Supported Browsers</a></li><li><a href="#supported-language-features">Supported Language Features</a></li><li><a href="#configuring-supported-browsers">Configuring Supported Browsers</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
@@ -95,7 +95,7 @@
|
||||
<blockquote>
|
||||
<p>When editing the <code>browerslist</code> config, you may notice that your changes don't get picked up right away. This is due to an <a href="https://github.com/babel/babel-loader/issues/690">issue in babel-loader</a> not detecting the change in your <code>package.json</code>. An easy solution is to delete the <code>node_modules/.cache</code> folder and try again.</p>
|
||||
</blockquote>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 4/14/2019 by Ian Schmitz</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/available-scripts"><span class="arrow-prev">← </span><span>Available Scripts</span></a><a class="docs-next button" href="/create-react-app/docs/updating-to-new-releases"><span>Updating to New Releases</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#supported-browsers">Supported Browsers</a></li><li><a href="#supported-language-features">Supported Language Features</a></li><li><a href="#configuring-supported-browsers">Configuring Supported Browsers</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
</span></div></article></div><div class="docLastUpdate"><em>Last updated on 5/8/2019 by Ian Sutherland</em></div><div class="docs-prevnext"><a class="docs-prev button" href="/create-react-app/docs/available-scripts"><span class="arrow-prev">← </span><span>Available Scripts</span></a><a class="docs-next button" href="/create-react-app/docs/updating-to-new-releases"><span>Updating to New Releases</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#supported-browsers">Supported Browsers</a></li><li><a href="#supported-language-features">Supported Language Features</a></li><li><a href="#configuring-supported-browsers">Configuring Supported Browsers</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/create-react-app/" class="nav-home"><img src="/create-react-app/img/logo.svg" alt="Create React App" width="66" height="58"/></a><div><h5>Docs</h5><a href="/create-react-app/docs/getting-started">Get Started</a><a href="https://reactjs.org/" target="_blank" rel="noreferrer noopener">Learn React</a></div><div><h5>Community</h5><a href="https://stackoverflow.com/questions/tagged/create-react-app" target="_blank" rel="noreferrer noopener">Stack Overflow</a><a href="https://spectrum.chat/react" target="_blank" rel="noreferrer noopener">Spectrum</a><a href="https://twitter.com/reactjs" target="_blank" rel="noreferrer noopener">Twitter</a></div><div><h5>More</h5><a href="https://www.github.com/facebook/create-react-app">GitHub</a><a class="github-button" href="https://github.com/facebook/create-react-app" data-icon="octicon-star" data-count-href="/facebook/create-react-app/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">Star</a></div></section><a href="https://code.facebook.com/projects/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/create-react-app/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright">Copyright © 2019 Facebook Inc.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>
|
||||
document.addEventListener('keyup', function(e) {
|
||||
if (e.target !== document.body) {
|
||||
return;
|
||||
|
||||
Reference in New Issue
Block a user