অ্যাপ্লিকেশন তৈরি করুন .env ফাইলগুলি না তুলছেন?

Question

আমি আমার অ্যাপ্লিকেশনটি বুটস্ট্র্যাপ করতে তৈরি করুন প্রতিক্রিয়া অ্যাপ ব্যবহার করছি ।

আমি দুটি .envফাইল যুক্ত করেছি .env.developmentএবং .env.productionমূলটিতে।

আমার .env.developmentঅন্তর্ভুক্ত:

API_URL=http://localhost:3000/api
CALLBACK_URL=http://localhost:3005/callback

আমি যখন আমার অ্যাপ্লিকেশনটি ব্যবহার করি react-scripts startএবং কনসোলটি ব্যবহার করি তখন process.envএটি থেমে যায়

{ NODE_ENV: "development", PUBLIC_URL: "" }

আমি বিভিন্ন জিনিস চেষ্টা করেছি, তবে এটি কেবল আমার বিকাশের ফাইলে যাচাইযোগ্যগুলি বেছে নেচ্ছে না, আমি কী ভুল করছি ?!

ডিরেক্টরি কাঠামোটি হ'ল:

/.env.development
/src/index.js

প্যাকেজ.জসন লিপিটি হ'ল:

"start": "export PORT=3005; npm-run-all --parallel server:start client:start",
    "client:start": "export PORT=3005; react-scripts start",
    "server:start": "node server.js",
    "build": "react-scripts build",

সম্পাদনা করুন:

@jamcreencia সঠিকভাবে উল্লেখ আউট আমার ভেরিয়েবল পূর্বে সমাধান করা উচিত সঙ্গে REACT_APP।

সম্পাদনা 2

আমি ফাইলটির নাম রাখি .envতবে এটি ব্যবহার করি .env.developmentবা না রাখলে এটি ঠিক আছে.end.production

Comments

আপনি কি আপনার package.jsonফাইল পোস্ট করতে পারেন ?

— স্টিভ চ্যামিলার্ড

process.envএমন কিছু যা ব্যাক-এন্ড (নোড বা আপনি যা ব্যবহার করছেন) পড়তে পারে। ফ্রন্ট-এন্ড বান্ডেলটির process.envব্রাউজারে চালিত হওয়ার সাথে সাথে কী হয় তা সম্পর্কে কোনও ধারণা নেই । বান্ডিল করার সময় আপনি এটি বান্ডলে পাস করার জন্য ওয়েবপ্যাকটি কনফিগার করতে পারেন বা আরও সহজ আপনি ইন্ডেক্স ফাইলটিতে ব্যাক-এন্ড থেকে আপনি বৈশ্বিক চলক হিসাবে রেন্ডার করতে পারেন।

— রাউল রেনি

সম্ভবত কেস নয়, তবে আমি এটি কয়েক বার চালিয়েছি এবং আমি যে সমস্যাটি পেয়েছি তা হ'ল আমার কম্পিউটার যখন প্রচুর মেমরি ব্যবহার করে তখন আমি আমার .env পরিবর্তনশীল বোঝাটি পাই না। আমি উবুন্টু 16.4 ব্যবহার করি। টার্মিনালটি থেকে ভেরিয়েবলটি লোড করার চেষ্টা করুন react-scripts start API_URL=http://localhost:3000/api CALLBACK_URL=http://localhost:3005/callbackযদি আপনি এখনও সেগুলি না দেখতে পান তবে আমি আমার সিস্টেমটি মেমরির ব্যবহার হ্রাস করতে পুনরায় চালু করব এবং আবার চেষ্টা করুন সাধারণত এটি আমার জন্য এটি সমাধান করে।

— ফেমি ওনি

@ রৌলরাইন তৈরি-প্রতিক্রিয়া-অ্যাপ্লিকেশন পরিচালনা করে en আপনার জন্য আরও কনফিগার করার প্রয়োজন নেই বলে বক্স থেকে বের করুন

— ফেমি ওনি

Answer 1

এর সাথে create-react-app, REACT_APP_অ্যাক্সেস করতে সক্ষম হওয়ার জন্য আপনাকে ভেরিয়েবল নামের উপসর্গের প্রয়োজন ।

উদাহরণ:

REACT_APP_API_URL=http://localhost:3000/api
REACT_APP_CALLBACK_URL=http://localhost:3005/callback

এখানে আরও তথ্য দেখুন

Comments

এটি অতীব গুরুত্বপূর্ণ। আমি এটি মিস করেছি তবে হ্যাঁ এটি উপসর্গটির সাথে কাজ করবে না

— ফেমি ওনি

এটি কাজ করে যখন আমি ব্যবহার করি .envতবে .env.developmentবা না .env.production?

— শেনকু

@ শেনকু আপনি কীভাবে এটির সাথে কাজ করেন .envএবং কেন .env.developmentএবংenv.production

— কনস্টান্টিন চিরিলা

দেবগণ ফ্রন্ট-এন্ড কাজ করছেন, কারণ আপনার ব্রাউজারে নোডজে নেই, আপনার ওয়েবপ্যাক লাগবে ... মেহ

— স্টিফেন

ধন্যবাদ. আমি কয়েক ঘন্টা ধরে উত্তর খুঁজছি।

— ফাহমিদ

Answer 2

আপনার .env ফাইলটি এসআরসি ফোল্ডারের ভিতরে নয়, মূল ডিরেক্টরিতে রয়েছে তা নিশ্চিত করুন।

Comments

যদিও, ডকুমেন্টেশন পড়ার সময় আমি দেখেছি এটি মূল ডিরেক্টরিতে থাকা উচিত, তবুও আমি আমার .env ফাইলটি এসআরসি ফোল্ডারে যুক্ত করতে পেরেছি ... (ফেসপাম) আপনার উত্তরের জন্য ধন্যবাদ।

— কর্নে

আমার একই সমস্যা ছিল, এসআরসি ফোল্ডারের অভ্যন্তরে এটি কাজ করে না তবে এটি সংস্করণ ৩.৪.৩ এ মূল ফোল্ডারে যাওয়ার পরে কাজ করেছে

— বিনোদ কুমার

Answer 3

এই একই সমস্যা ছিল! সমাধানটি ছিল আমার নোড সার্ভারের সংযোগটি বন্ধ করা (আপনি এটি সিটিআরএল + সি দিয়ে করতে পারেন)। তারপরে আপনার সার্ভারটি 'এনপিএম রান স্টার্ট' দিয়ে পুনরায় শুরু করুন এবং .env সঠিকভাবে কাজ করা উচিত।

সূত্র: গিথুব

Answer 4

আপনি একাধিক পরিবেশ যেমন ব্যবহার করতে চান .env.development .env.production

ডটেনভ-ক্লাইপ প্যাকেজ ব্যবহার করুন

যোগ করুন .env.developmentএবং .env.productionপ্রকল্পের মূল ফোল্ডারে

এবং আপনার প্যাকেজ.জসন

"scripts": {
    "start": "react-app-rewired start",
    "build-dev": "dotenv -e .env.development react-app-rewired build",
    "build-prod": "dotenv -e .env.production react-app-rewired build",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test --env=jsdom",
    "eject": "react-scripts eject"   
},

তারপরে পরিবেশের মতো নির্মাণ করুন

npm run-script build-dev 

Comments

এটা dotenvনাকি dotenv-cli?

— ড্রাজেন বিজেলভুক

বিভিন্ন পরিবেশের জন্য বিভিন্ন .env ফাইল থাকা এখন বাক্সের বাইরে তৈরি-প্রতিক্রিয়া-অ্যাপ্লিকেশন: তৈরি-প্রতিক্রিয়া-অ্যাপ্লিকেশন ডক্স দ্বারা সমর্থিত । স্পষ্টভাবে ডটেনভ ব্যবহার করার দরকার নেই (ক্রিয়েট-রিঅ্যাক্ট-অ্যাপটি বাস্তবে পরিবেশের ভেরিয়েবলগুলি পরিচালনা করতে পর্দার আড়ালে ব্যবহার করে)

— মার্নিক্সহোহো

@ মারিয়া জাইসিংহ আঞ্জু, সিনট্যাক্সটি অন্তর্গত dotenv-cli, নন dotenv: এনএমপিজেএস

— ডটেনভ-

@ AMS777 আমি ব্যবহার করছি dotenv npm না dotenv-CLI

— মারিয়া Jeysingh Anbu

@ মারিয়াজিৎসিংহ আনবু, আমি ব্যবহার করতে চেয়েছিলাম dotenvকিন্তু একটি ত্রুটি পেয়েছে। আমি ডকুমেন্টেশন চেক করেছি কিন্তু -eকমান্ড লাইনের জন্য বিকল্পটি খুঁজে পাইনি । তবে আমি এটি dotenv-cliডকুমেন্টেশনে পেয়েছি । এজন্যই আমি বলছিলাম। পরিশেষে আমি ব্যবহার করছি env-cmd, না আছে dotenvএবং dotenv-cliএকই সময়, যা বিভ্রান্তির হয়ে উঠতে পারে এ ইনস্টল করা নেই।

— এএমএস 777

Answer 5

সংক্রান্ত env-cmd কমান্ড । VMois এর ধরনের অনুযায়ী GitHub এর পোস্টে , env-cmd কমান্ড (এই প্রবন্ধ লেখার হিসাবে সংস্করণ 9.0.1) আপডেট করা হয়েছে বিভিন্ন পরিবেশের হিসাবে আপনার অনুসরণ করে কাজ করবে প্রতিক্রিয়া প্রকল্প:

"scripts": {
    "build:local": "env-cmd -f ./.env.production.local npm run build",
    "build:production": "env-cmd -f ./.env.production npm run build"
  }

আপনার প্যাকেজ.জসন ফাইলে।

Comments

আপনাকে অনেক ধন্যবাদ, এই মন্তব্যটি আমাকে বাঁচিয়েছে। তৈরি-প্রতিক্রিয়া-অ্যাপ্লিকেশন ডকুমেন্টেশনটি এটি আপডেট করে না, তাই আমি কী ভুল তা

— অনুধাবন

আপনি আমাকে এখানে সম্পূর্ণ রক্ষা করেছেন। আমি এই জিনিস উপর ঘুরছিলাম। আপনাকে ধন্যবাদ

— MDiesel

এই লোকটিকে কেউ একজন মেডেল দিয়েছেন

— রীতেশ পিভি

Answer 6

এই উদ্দেশ্যে এনভ-সিএমডি মডিউল রয়েছে। বিভাগে npm i env-cmdআপনার package.jsonফাইলটিতে এনপিএমের মাধ্যমে ইনস্টল করুন scripts:

  "scripts": {
    "start": "env-cmd .env.development react-scripts start",
    "build": "GENERATE_SOURCEMAP=false env-cmd .env.production react-scripts build",
  }

আপনার প্রকল্পের মূলটিতে আপনাকে একই এনভ ভেরিয়েবলের সাথে ভিন্ন ভিন্ন মান সহ দুটি ফাইল তৈরি করতে হবে:

.env.development
.env.production

তারপরে এগুলি জনসাধারণ থেকে বাদ দিন। এর জন্য আপনার .gitignoreফাইলে দুটি লাইন যুক্ত করুন:

.env.development
.env.production

সুতরাং এটি ডেভ এবং প্রোডের জন্য বিভিন্ন এনভ ভেরিয়েবল ব্যবহার করার উপযুক্ত উপায়।

Comments

./node_modules/.bin/env-cmd: সম্পূর্ণ পাথ, মত ব্যবহারের চেষ্টা

— Nastro

তবে আমি আমার উত্তরে পদ্ধতির প্রস্তাব দিই না। এখন আমি জানি যে প্রতিক্রিয়া .env নিয়ে কাজ করার জন্য মেকানিককে বিল্ড দেয়

— নাস্ত্রো

Answer 7

আমার একই সমস্যা ছিল, তবে এটি ছিল কারণ আমার আমার .env ফাইলটি জেএসের পরিবর্তে ওয়াইএএমএল ফর্ম্যাটে ছিল।

ইহা ছিল

REACT_APP_API_PATH: 'https://my.api.path'

তবে এটি হওয়া দরকার

REACT_APP_API_PATH = 'https://my.api.path'

Comments

এ জাতীয় একটি সহজ তবে ভাল স্পট। আমি একই কাজ করেছি এবং গাছগুলির জন্য কাঠ দেখতে পেলাম না। ধন্যবাদ

— অ্যান্ডি অ্যালিসন

এর জন্য ধন্যবাদ! আমি এই সামান্য ত্রুটিটি না দেখে সারাদিন অনুসন্ধান করছিলাম :)

— চিয়া ইয়ংকাং

Answer 8

যদি .envফাইলটি কাজ করে .env.developmentবা .env.productionনা করে তবে এই দুটিয়ের সাথে একটি খালি .envফাইল তৈরি করুন। আমি জানি না কেন তবে এটি আমার পক্ষে কাজ করে।

Answer 9

এবং env-file এ API কী-এর পরে আধা-কোলন না থাকার কথা মনে রাখবেন।

REACT_APP_API_KEY = 'ae87cec695cc4heheh639d06c9274a';

হতে হবে

REACT_APP_API_KEY = 'ae87cec695cc44heheh1639d06c9274a'

এটা আমার ত্রুটি ছিল

Answer 10

সর্বশেষ প্রতিক্রিয়া-স্ক্রিপ্ট হিসাবে (3.2.0) এটি বলা সহজ একটি সহজ

PORT=4000
BROWSER=none

আপনার .env বা .env.de વિકાસ ফাইল (..etc) এ যা রুট ফোল্ডারে থাকার কথা।

এটি তখন আরএএসিএসএপিপি উপসর্গের সাথে কাজ করবে না (ডক্সগুলি আমার অনুমান অনুযায়ী পুরানো) এবং এটির জন্য কোনও অতিরিক্ত এনপিএম প্যাকেজ লাগবে না (প্রতিক্রিয়া-স্ক্রিপ্টগুলিতে ইতিমধ্যে ডোটেনভ 6.২.০ অন্তর্ভুক্ত রয়েছে)

Comments

এটা মিথ্যা। github.com/facebook/create-react-app/blob/…

— গুডজিপ