Nuxt.js 安裝與環境配置

nuxt.js文檔

npx create-nuxt-app <項目名>

安裝nuxt時記得選擇dotenv這個用來配置環境

安裝 cross-env

cnpm install --save-dev cross-env

在package.json中配置命令

 "scripts": {
    "dev": "cross-env NODE_ENV=development BASE=dev nuxt",
    "build": "cross-env NODE_ENV=production BASE=prod nuxt build",
    "start": "cross-env NODE_ENV=production BASE=prod nuxt start",
    "generate": "cross-env NODE_ENV=production BASE=prod nuxt generate",
    "build:test": "cross-env NODE_ENV=testing BASE=test nuxt build",
    "start:test": "cross-env NODE_ENV=testing BASE=test nuxt start",
    "generate:test": "cross-env NODE_ENV=testing BASE=test nuxt generate"
  }

在根目錄新建.env .env.test .env.pord 文件

分別在三個目錄新建寫下各個環境的配置
env : 開發環境
env.test : 測試環境
env.prod : 生產環境

# **環境

# API路徑
BASE_URL =

# 上傳路徑
BASE_UP_LOAD_URL =

# 域名
BASE_HOST = 

# 端口
BASE_PORT = 

nuxt.config.js配置

require('dotenv').config()
  modules: [
    // Doc: https://github.com/nuxt-community/dotenv-module
    ['@nuxtjs/dotenv', { filename: `.env.${process.env.BASE}` }]
  ],

測試環境配置成功沒有

export default {
nuxt.config.js
 server: {
    port: process.env.BASE_PORT,
    host: process.env.BASE_HOST
  }
}

重新跑一次

npm run dev
端口域名配置成功
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。