使用Vite和VueJS3访问生产环境变量

qmelpv7a  于 12个月前  发布在  Vue.js
关注(0)|答案(1)|浏览(169)

我已经构建了一个应用程序,它可以在本地访问.env.env.local环境变量,但是当使用Docker和MySQL Registry部署到Google Cloud Run时,浏览器控制台中的变量是undefined
有几点:

  • 变量有'VITE_'前缀。
  • prod的浏览器控制台中,我可以看到MODE: "production"PROD: true
  • 我也试过在GCloud控制台中设置环境变量,但没有用。

我访问变量为:accessToken: import.meta.env.VITE_STORYBLOK_ACCESS_TOKEN
我假设问题是在复制env文件时与Dockerfile有关,但我找不到修复方法:

# build stage
FROM node:lts-alpine as build-stage
COPY ./.env.production/ /
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 8080
CMD ["nginx", "-g", "daemon off;"]

云构建返回错误:COPY failed: file not found in build context or excluded by .dockerignore: stat .env.production/: file does not exist
有没有人对修复Dockerfile或设置构建以从部署设置中获取环境变量有任何建议?

x9ybnkn6

x9ybnkn61#

在尝试修复这个问题几个小时后,我发现.gitignore正在阻止.env文件上传到GCloud。
这个.gcloudignore(类似于存在Git文件时生成的)将阻止上传.gcloudignore文件、.git目录和.gitignore文件中忽略的任何文件:https://cloud.google.com/sdk/gcloud/reference/topic/gcloudignore
解决方案:
1.在根目录下创建一个.gcloudignore文件
1.explanatory include上传中的环境变量,使用!.env上传

相关问题