【Nuxt.js】.envの使い方
Nuxtで.envを使用する方法（備忘録）
リファレンス：
1. dotenvモジュールをインストール
npmで管理してる場合
npm install @nuxtjs/dotenv
yarnで管理してる場合
yarn add @nuxtjs/dotenv
正しくインストールされた場合は、package.json に@nuxtjs/dotenvが追加されるので、確認してみてください
こんな感じ（package.json）↓
"dependencies": {
"@nuxtjs/axios": "^5.3.6",
"@nuxtjs/dotenv": "^1.4.1",
"axios": "^0.19.2",
"firebase": "^7.15.5",
"nuxt": "^2.0.0",
"vuex-persistedstate": "^3.0.1"
},
2.nuxt.config.jsに設定を記載(赤文字部分を追加)
require('dotenv').config()
export default {
/* 略 */
buildModules: [
'@nuxtjs/dotenv'
],/* 略 */
}
3. .envファイルを作成し、定数を記載
API_KEY = XXsssdd22
SECRET_KEY = ????
4. index.vueなど、vueファイル内で使用
<script>
console.log(process.env.API_KEY)
console.log(process.env.SECRET_KEY)
</script>
以上ですー！！
ついでに、git管理している場合は、.gitignoreに.env追加しときましょ
おやすみなさい
