在Angular项目中，可以使用Angular CLI来区分开发环境和生产环境下的资源配置。以下是解决方法的步骤及示例代码：

步骤1：安装Angular CLI

首先，确保你已经安装了最新版本的Angular CLI。如果没有安装，可以使用以下命令进行安装：

npm install -g @angular/cli

步骤2：创建不同的环境配置文件

在项目的根目录下，创建两个环境配置文件：environment.prod.ts和environment.ts。这两个文件将用于存储不同环境下的配置信息。

例如，environment.prod.ts文件中可以包含生产环境下的配置信息，如API的生产URL：

export const environment = {
  production: true,
  apiUrl: 'https://api.example.com'
};

而environment.ts文件中可以包含开发环境下的配置信息，如API的开发URL：

export const environment = {
  production: false,
  apiUrl: 'http://localhost:3000'
};

步骤3：在.angular-cli.json中配置不同环境下的资源

打开.angular-cli.json文件，找到apps下的environments属性。将其更新为以下代码：

"environments": {
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts"
}

这将告诉Angular CLI在开发环境和生产环境下使用不同的环境配置文件。

步骤4：使用环境变量

在应用程序的代码中，可以使用environment变量来获取环境配置中的值。例如，可以在组件中使用environment.apiUrl来获取不同环境下的API URL。

示例代码：

import { Component } from '@angular/core';
import { environment } from '../environments/environment';

@Component({
  selector: 'app-root',
  template: `
    
API URL: {{ apiUrl }}
  `
})
export class AppComponent {
  apiUrl = environment.apiUrl;
}

在开发环境中，页面将显示API URL: http://localhost:3000；在生产环境中，页面将显示API URL: https://api.example.com。

这样，你就可以根据不同的环境配置来使用不同的资源，如不同的API URL、不同的样式文件等。