问题描述
我在 nrwl/nx 工作区中设置了一个包含多个 nodejs 和 Angular 应用程序的项目.
我正在尝试使用环境文件在 nodejs 应用程序中.
我已经设置了这样的导入:import {environment} from './environments/environment';
然后我运行 ng serve my-node-app
并显示非生产环境.
现在我尝试执行 ng serve my-node-app --prod
以查看应用程序如何与生产设置一起工作 - 但我收到错误:
在项目 my-node-app
中找不到配置生产".
这是项目的 angular.json 配置:
"ui-server": {"root": "apps/ui/server","sourceRoot": "apps/ui/server/src","projectType": "应用程序",前缀":用户界面服务器",原理图":{},建筑师":{建造": {"builder": "@nrwl/builders:node-build",选项": {"outputPath": "dist/apps/ui/server","main": "apps/ui/server/src/main.ts","tsConfig": "apps/ui/server/tsconfig.app.json","assets": ["apps/ui/server/src/assets"]},配置":{生产": {优化":真,"extractLicenses": 真,文件替换":[{"替换": "apps/ui/server/src/environments/environment.ts","with": "apps/ui/server/src/environments/environment.prod.ts"}]}}},服务": {"builder": "@nrwl/builders:node-execute",选项": {"buildTarget": "ui-server:build"}},棉绒":{"builder": "@angular-devkit/build-angular:tslint",选项": {tsConfig":["apps/ui/server/tsconfig.app.json",apps/ui/server/tsconfig.spec.json"],排除":[**/node_modules/**"]}},测试": {"builder": "@nrwl/builders:jest",选项": {"jestConfig": "apps/ui/server/jest.config.js","tsConfig": "apps/ui/server/tsconfig.spec.json"}}}}
我错过了什么吗?
我在寻找如何获取 .env
文件中定义的环境变量时发现了这篇文章.
process.env.ENVIRONMENTAL_VARIABLES
在服务器上渲染时可以访问前端部分(例如 Angular Universal
),其中有 .env
Nrwl
monorepo 和 webpack 属性的根,如:
const dotenv = require('dotenv-webpack');模块.出口 = {插件: [新的 dotenv(),],};
不要忘记更改您的angular.json
:
我将自定义 webpack
命名为 webpack.browser.config.js
.
现在,假设您有一个 server/...
,您将其用于某些后端,那么您将无法在那里访问它们.您需要安装 dotenv
包并在 server/main.ts
中,假设这是您的服务器的根目录,这样就需要此包:
require('dotenv').config();
注意:在 Angular 8
之前,我们还可以在 等文件中设置
.因此,可以应用与 webpack
-服务器相关逻辑webpack.server.config.jsdotenv
相关的基本相同的代码,该代码位于 webpack.browser.config.js
中.但是,它不再起作用.Angular CLI Builders 被用于构建 &改为服务器 SSR 应用.
部署到 Firebase
/使用 Cloud Functions for Firebase
(可能还有其他无服务器/FaaS)?
然后在您的 functions
文件夹中,您还需要粘贴 .env
文件.我在这里假设您正在部署 functions
.
对于调试,我建议:
console.log(require('dotenv').config({ debug: true }));
可能会为您节省大量时间.
I've setup a project with several nodejs and angular apps inside a nrwl/nx workspace.
I'm trying to work with the environment filesinside the nodejs apps.
I've setup the import like this:import {environment} from './environments/environment';
Then I ran ng serve my-node-app
and it shows the environment for non production.
Now I tried to do ng serve my-node-app --prod
to see how the app works with a production setup - but I get the error:
Configuration 'production' could not be found in project my-node-app
.
Here's the project's angular.json config:
"ui-server": {
"root": "apps/ui/server",
"sourceRoot": "apps/ui/server/src",
"projectType": "application",
"prefix": "ui-server",
"schematics": {},
"architect": {
"build": {
"builder": "@nrwl/builders:node-build",
"options": {
"outputPath": "dist/apps/ui/server",
"main": "apps/ui/server/src/main.ts",
"tsConfig": "apps/ui/server/tsconfig.app.json",
"assets": ["apps/ui/server/src/assets"]
},
"configurations": {
"production": {
"optimization": true,
"extractLicenses": true,
"fileReplacements": [
{
"replace": "apps/ui/server/src/environments/environment.ts",
"with": "apps/ui/server/src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@nrwl/builders:node-execute",
"options": {
"buildTarget": "ui-server:build"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"apps/ui/server/tsconfig.app.json",
"apps/ui/server/tsconfig.spec.json"
],
"exclude": ["**/node_modules/**"]
}
},
"test": {
"builder": "@nrwl/builders:jest",
"options": {
"jestConfig": "apps/ui/server/jest.config.js",
"tsConfig": "apps/ui/server/tsconfig.spec.json"
}
}
}
}
Am I missing something?
I've found this post when I was looking how to fetch the environmental variables defined in .env
file.
process.env.ENVIRONMENTAL_VARIABLES
in frontend part can be accessed when rendering on the server (e.g. Angular Universal
), having .env
in the root of Nrwl
monorepo and webpack properties, such as:
const dotenv = require('dotenv-webpack');
module.exports = {
plugins: [
new dotenv(),
],
};
Don't forget to change your angular.json
:
...
"architect": {
"build": {
"builder": "@angular-builders/custom-webpack:browser",
"options": {
"customWebpackConfig": {
"path": "./webpack.browser.config.js",
"replaceDuplicatePlugins": true
},
...
I've named the custom webpack
as webpack.browser.config.js
.
Now, let say you have a server/...
, which you're using for some backend stuff, then you won't have them accessible there. You need to install dotenv
package and in the server/main.ts
, let say that's your server's root, require this package, that way:
require('dotenv').config();
Note: until Angular 8
we were able to set up also webpack
-server related logic, in a file such as webpack.server.config.js
. Therefore, it was doable to apply basically same code related to dotenv
, which was in webpack.browser.config.js
. However, it doesn't work anymore. Angular CLI Builders are being used to build & server SSR apps instead.
Deploying to Firebase
/using Cloud Functions for Firebase
(and possibly other Serverless/FaaS)?
Then in your functions
folder you need to paste the .env
file as well. I assume here that from functions
you're deploying.
For debugging I'd advise:
console.log(require('dotenv').config({ debug: true }));
Might save you a lot of time.
这篇关于在基于 nx 的 nodejs 应用程序中使用环境变量的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!