create-react-app起動時のブラウザ自動オープンをオフにする方法
2022.12.9
この記事の筆者：三好アキ（ウェブエンジニア）
「売り上げが伸びない」、「ウェブサイトから問い合わせが来ない」など、ウェブでお困りのお客さまの課題解決を、最新の知見を活かして行なっています。海外滞在が長く、日本語の情報が少ないJamstackやヘッドレスCMSなど最新のウェブテクノロジー、ウェブマーケティングに精通。事業について詳しくはこちらをご覧ください。
ウェブ制作の教本『はじめてつくるReactアプリ』など複数冊を執筆。本に関するインタビュー記事はこちら。
ブラウザ立ち上げをオフにするコード
React開発のひな型create-react-appは非常に便利ですが、しばらく開発作業をしていると不要だと感じる機能があります。
npm startコマンドで起動した時にブラウザが勝手にオープンする機能です。
これを防止するにはBROWSER=noneというコードをpackage.jsonに追加しましょう。
// package.json
{
"name": "monotein",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "BROWSER=none react-scripts start", // 追加
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
...
これでnpm startでReactを起動してもブラウザが自動でオープンせず、手動でhttp://localhost:3000を開くかたちになります。
ユーザーからの問い合わせを増やしたい、アイテムの購入率を高めたい等の「ビジネスのゴール」から逆算した効果的なウェブサイトを制作するmonotein。
monoteinについての案内資料の無料ダウンロードはこちら。
「これまでのホームページでは成果が出なかった」、「結果の出るウェブサイトが欲しい」、「JamstackやヘッドレスCMSなどの最新テクノロジーに移行したい」など、ウェブに関してお困りのことがありましたら、お気軽にご相談ください。
無料相談
