typescript Angular 2 多个模块的名称仅在大小写上有所不同

Angular 2 Multiple modules with names that only differ in casing

提问by Helzgate

The following warning occurs during compilation:

编译过程中出现以下警告：

WARNING in ./src/app/state/actions/userClass.ts There are multiple modules with names that only differ in casing. This can lead to unexpected behavior when compiling on a filesystem with other case-semantic. Use equal casing. Compare these module identifiers: * /Users/smp/Projects/training3/node_modules/@angularclass/hmr-loader/index.js!/Users/smp/Projects/training3/node_modules/awesome-typescript-loader/dist/entry.js?{configFileName: "tsconfig.webpack.json"}!/Users/smp/Projects/training3/node_modules/angular2-template-loader/index.js!/Users/smp/Projects/training3/node_modules/angular-router-loader/src/index.js?loader=system&genDir=compiled&aot=false!/Users/smp/Projects/training3/src/app/state/actions/UserClass.ts Used by 1 module(s), i. e. /Users/smp/Projects/training3/node_modules/@angularclass/hmr-loader/index.js!/Users/smp/Projects/training3/node_modules/awesome-typescript-loader/dist/entry.js?{configFileName: "tsconfig.webpack.json"}!/Users/smp/Projects/training3/node_modules/angular2-template-loader/index.js!/Users/smp/Projects/training3/node_modules/angular-router-loader/src/index.js?loader=system&genDir=compiled&aot=false!/Users/smp/Projects/training3/src/app/features/portal/content/tabs/userclasses/userclasses.component.ts * /Users/smp/Projects/training3/node_modules/@angularclass/hmr-loader/index.js!/Users/smp/Projects/training3/node_modules/awesome-typescript-loader/dist/entry.js?{configFileName: "tsconfig.webpack.json"}!/Users/smp/Projects/training3/node_modules/angular2-template-loader/index.js!/Users/smp/Projects/training3/node_modules/angular-router-loader/src/index.js?loader=system&genDir=compiled&aot=false!/Users/smp/Projects/training3/src/app/state/actions/userClass.ts Used by 3 module(s), i. e. /Users/smp/Projects/training3/node_modules/@angularclass/hmr-loader/index.js!/Users/smp/Projects/training3/node_modules/awesome-typescript-loader/dist/entry.js?{configFileName: "tsconfig.webpack.json"}!/Users/smp/Projects/training3/node_modules/angular2-template-loader/index.js!/Users/smp/Projects/training3/node_modules/angular-router-loader/src/index.js?loader=system&genDir=compiled&aot=false!/Users/smp/Projects/training3/src/app/state/effects/userClass.ts

./src/app/state/actions/userClass.ts 中的警告 有多个模块的名称只是大小写不同。在具有其他大小写语义的文件系统上编译时，这可能会导致意外行为。使用相同的外壳。比较这些模块标识符： * /Users/smp/Projects/training3/node_modules/@angularclass/hmr-loader/index.js!/Users/smp/Projects/training3/node_modules/awesome-typescript-loader/dist/entry.js ?{configFileName: "tsconfig.webpack.json"}!/Users/smp/Projects/training3/node_modules/angular2-template-loader/index.js!/Users/smp/Projects/training3/node_modules/angular-router-loader /src/index.js?loader=system&genDir=compiled&aot=false!/Users/smp/Projects/training3/src/app/state/actions/UserClass.ts 由 1 个模块使用，即

回答by Helzgate

The names of my files where fine. This issue popped up because in one of my imports I capitalized UserClass:

我的文件的名称很好。出现这个问题是因为在我的一个导入中我将 UserClass 大写：

import * as userClassActions from '../../../../../state/actions/UserClass';

After changing the import to the following the error went away:

将导入更改为以下内容后，错误消失了：

import * as userClassActions from '../../../../../state/actions/userClass';

回答by sankalpvk18

I was getting the same error because of a mistake I did while writing import.

由于我在编写导入时犯的错误，我遇到了同样的错误。

Check if you've written somewhere --> import { RouterModule } from '@angular/Router';

检查你是否在某处写过 --> import { RouterModule } from '@angular/Router';

Now, change it to --> import { RouterModule } from '@angular/router';

现在，将其更改为 --> import { RouterModule } from '@angular/router';

This solved my problem. Hope it works for you too.

这解决了我的问题。希望它也适用于你。

See the images below for more clarity

请参阅下面的图片以获得更清晰的信息

1. https://i.stack.imgur.com/wS1nh.png

2. https://i.stack.imgur.com/GyDGs.png

1. https://i.stack.imgur.com/wS1nh.png

2. https://i.stack.imgur.com/GyDGs.png

回答by theshinylight

If you are coding with Visual Studio Code, it may happen that it will sometimes add path with capital letter and other times with a lower letter.

如果您使用Visual Studio Code 进行编码，则可能会发生有时会添加大写字母的路径，有时会添加小写字母的路径。

In my case I was getting the error because of Angular Materialcomponents were imported from '@angular/material'in some files and in (at least 2) other files from '@angular/Material'.

在我的情况下，由于Angular Material组件是从'@angular/material'某些文件中导入的，而在（至少 2 个）其他文件中从'@angular/Material'.

Lower-casing '@angular/Material'removed the warning.

下套管'@angular/Material'删除了警告。

Hope this helps.

希望这可以帮助。

回答by andymel

I got that warning after renaming the fileto upper case intentionally.

有意将文件重命名为大写后，我收到了该警告。

After moving the specific file into another folder and back to the originalthe warning was gone.

经过特定的文件移动到另一个文件夹，并回到原来的警告不见了。

(I use VSC with some angular extensions that do the updating of imports when moving files)

（我使用 VSC 和一些角度扩展，在移动文件时更新导入）

回答by BlackICE

This can also be caused by entries in your webpack config:

这也可能是由 webpack 配置中的条目引起的：

const path = require('path');
const webpack = require('webpack');

module.exports = {
  mode: 'development'
  , entry: {
    crm: './Scripts/app/crm/crm.router.js'
    , labels: './Scripts/app/labels/labels.router.js'
    , admin: './scripts/app/crm/admin/admin.router.js'
  }
  , output: {
    filename: '[name]Bundle.js'
    , path: path.resolve(__dirname, 'dist')
  }
///...
};

Notice the casing of scriptsvs Scriptsin the entry section.

请注意条目部分中脚本与脚本的大小写。

回答by Ashish Patel

I was facing this issue while implementing angular 4 App with asp.net core 2.0 and web pack.

我在使用 asp.net core 2.0 和 web pack 实现 angular 4 App 时遇到了这个问题。

This issue can occur if you import service or class with two different "./" or "../" relative path notation.

如果您使用两个不同的“./”或“../”相对路径表示法导入服务或类，则会出现此问题。

Import code in NavMenuComponent.

在 NavMenuComponent 中导入代码。

import { SampleService } from '../../services/sample.service';  

Changing with following code the error was resolved

使用以下代码更改错误已解决

import { SampleService } from './../../services/sample.service';    

Learn more about GitHub discussion

了解有关 GitHub 讨论的更多信息

回答by lpradhap

check if you have imported twice.

检查您是否已导入两次。