nuxt如何在JavaScript文件中访问env

Question

我无法在nuxt 2.15之外访问我的环境变量。当我部署时，我可以在浏览器中看到$nuxt.context.$config具有正确的变量，但是在自定义js文件中，我无法访问process.env.baseURL，它返回未定义。

// nuxt.config.ts
module.exports = {
  ssr: false,
  buildModules: [  
    ['@nuxtjs/dotenv', { systemvars: true }],
  ],
  publicRuntimeConfig: {
    baseURL: process.env.baseURL,
  }
  env: {
    baseURL: process.env.baseURL,
  }
}

这在页面/组件/中间件之间运行良好，我可以使用$config对象访问值

问题是我有一个JS文件，我想导入baseURL的值以在其他地方使用，但返回值为未定义

//constant.ts

const { publicRuntimeConfig, env } = require('./nuxt.config.ts');
const { baseURL, VPN_IP, ADMIN_MODE } = publicRuntimeConfig;

console.info('constant: baseURL', baseURL); // also undefined

export const GRPC_HOST = process.env.baseURL;  //this is undefined

我尝试将启动命令从nuxt start更改为node server/index.ts

const express = require('express');
const consola = require('consola');
require('dotenv').config();
const { Nuxt, Builder } = require('nuxt');
const app = express();

// Import and Set Nuxt.js options
const config = require('../nuxt.config.ts');
config.dev = process.env.NODE_ENV !== 'production';

async function start() {
  // Init Nuxt.js
  const nuxt = new Nuxt({ ...config, env: { baseURL: process.env.baseURL } });

  const { host, port } = nuxt.options.server;

  await nuxt.ready();
  // Build only in dev mode
  if (config.dev) {
    const builder = new Builder(nuxt);
    await builder.build();
  }

  // Give nuxt middleware to express
  app.use(nuxt.render);

  // Listen the server
  app.listen(port, host);
  consola.ready({
    message: `Server listening on https://${host}:${port} , environment:: ${process.env.NODE_ENV} baseURL:: ${process.env.baseURL}`,
    badge: true,
  });
}
start();

在服务器日志中，我可以看到baseURL在这里被设置了，NODE_ENV被设置为生产环境。

- rrrm93

Answer 1

尝试创建一个带有$config的javascript文件。首先，您需要确保已正确导入$config对象。您可以使用变量window.$nuxt.$config来实现这一点，

请尝试以下内容：

const baseURL = window.$nuxt.$config.baseURL
console.info('constant: baseURL', baseURL)
export const GRPC_HOST = baseURL

- Everton Luis de Oliveira

---

必须使用onLoad来检查dom是否准备就绪，从技术上讲它可以工作，但它会增加几秒钟的延迟，直到初始加载完成。 - rrrm93