Visual Studio 2017 中的 TypeScript:自动定义包含导致重复标识符错误

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/42663010/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 04:19:15  来源:igfitidea点击:

TypeScript in Visual Studio 2017: Automatic definition inclusion causes Duplicate Identifier errors

typescripttypescript-typingsvisual-studio-2017

提问by Brian Rak

UPDATE:I've got a workaround that makes things work acceptably with no hacks. I leave my prior attempts described below for posterity. See the answer for the working solution.

更新:我有一个解决方法,可以让事情在没有黑客的情况下正常工作。我将我之前的尝试留在下面描述的后代。请参阅工作解决方案的答案。



I've just upgraded an project to Visual Studio 2017 and I'm getting all kinds of TypeScript errors all of the sudden. Many of them are Duplicate identifiererrors. When I double-click one of the errors, it opens a file called index.d.ts, located in a directory such as:

我刚刚将一个项目升级到 Visual Studio 2017,我突然遇到了各种 TypeScript 错误。其中许多是Duplicate identifier错误的。当我双击其中一个错误时,它会打开一个名为 index.d.ts 的文件,该文件位于如下目录中:

C:\Users\[me]\AppData\Local\Microsoft\TypeScript\node_modules\@types\jquery\index.d.ts

Based on what I read on this page:

根据我在此页面上阅读的内容:

https://blogs.msdn.microsoft.com/visualstudio/2016/11/28/more-productive-javascript-in-visual-studio-2017-rc/

https://blogs.msdn.microsoft.com/visualstudio/2016/11/28/more-productive-javascript-in-visual-studio-2017-rc/

...it seems that what is happening is that Visual Studio is trying to helpfully download definition files for types where I've already manually included the definition files. The automatic inclusion of definition files sounds like a great feature! I'll just delete the manually included ones, right? But nothing I do seems to work. I hope someone can tell me where I'm going wrong.

...似乎正在发生的事情是 Visual Studio 正在尝试为我已经手动包含定义文件的类型下载定义文件。自动包含定义文件听起来是一个很棒的功能!我只会删除手动包含的那些,对吗?但我所做的一切似乎都不起作用。我希望有人能告诉我我哪里出错了。

For background, the way I had things working in Visual Studio 2015 was as follows. I was making use of three libraries: jQuery, jQuery UI, and QUnit. I simply downloaded the .d.ts files from DefinitelyTyped and put them in my Scripts directory in my project, and everything worked properly until I opened the project in VS 2017.

作为背景,我在 Visual Studio 2015 中工作的方式如下。我使用了三个库:jQuery、jQuery UI 和 QUnit。我只是从 DefineTyped 下载了 .d.ts 文件并将它们放在我的项目中的 Scripts 目录中,一切正常,直到我在 VS 2017 中打开该项目。

From the error messages, it seems that Visual Studio 2017 is bringing in its own definition files, so I figured I'd just delete the ones I had brought in manually. However, when I do that, now I get tons of Cannot find name $errors, which seems to mean that those definition files are no longer being brought in for some reason.

从错误消息来看,Visual Studio 2017 似乎引入了自己的定义文件,所以我想我只需删除我手动引入的那些。但是,当我这样做时,现在我收到了大量Cannot find name $错误,这似乎意味着由于某种原因不再引入这些定义文件。

Next, I figured that maybe the problem was that I didn't actually have the JQuery (and other library) source files in my project. I'm just referencing them from Google's CDN in my HTML source. The link above makes it sound like Visual Studio is looking for an actual loose file as the indicator that it should bring in definition files. So I manually added files to my Scripts directory and rebuilt, but nothing changed.

接下来,我想问题可能在于我的项目中实际上没有 JQuery(和其他库)源文件。我只是在我的 HTML 源代码中从 Google 的 CDN 中引用它们。上面的链接听起来像是 Visual Studio 正在寻找一个实际的松散文件作为它应该引入定义文件的指标。所以我手动将文件添加到我的 Scripts 目录并重建,但没有任何改变。

The linked page above also talks about including your library files from npm or bower, or using a tsconfig.json file, but before I go down those roads (not part of my normal workflow), I'm hoping someone can tell me, is there a preferred way of bringing in TypeScript definitions in Visual Studio 2017? Thanks in advance.

上面的链接页面还讨论了从 npm 或 bower 中包含您的库文件,或使用 tsconfig.json 文件,但在我走上这些道路(不是我正常工作流程的一部分)之前,我希望有人能告诉我,是有在 Visual Studio 2017 中引入 TypeScript 定义的首选方法吗?提前致谢。



UPDATE:(See Update 2 below too) I was able to get things working. This was not exactly intuitive, so I'm sharing my steps here in the hope that a) it helps someone, and b) someone can tell me if I'm just doing this the wrong way.

更新:(也请参阅下面的更新 2)我能够使事情正常进行。这并不完全直观,所以我在这里分享我的步骤,希望 a) 它可以帮助某人,b) 有人可以告诉我我是否只是以错误的方式做这件事。

  1. Remove all TypeScript code and definition files from project.
  2. Open packages.json and remove any definition file references there too.
  3. Clean and build. No errors or warnings.
  4. Via NuGet, install the definition file you need (for example, for jQuery, the package you want is "jquery.TypeScript.DefinitelyTyped").
  5. This will install the definition file in Scripts\typings\jquery.
  6. Do the same for other libraries you reference.
  7. Add a new test TypeScript file and add a line that attempts to utilize a library, for example, var foo = $(document);
  8. IntelliSense works! Project builds! Looks like we are back in business!
  9. Not so fast. A few seconds later, we're getting Duplicate identifier errors again. It seems that Visual Studio picked up the definition files on its own (perhaps activated by my inclusion of the definition files via NuGet) and now we have conflicts again.
  10. Add tsconfig.js file with the following directive, which prevents Visual Studio from downloading its own copies of the definition files: { "compilerOptions": { "types": [] } }
  11. Errors gone.
  12. Not so fast! Seconds later, hundreds of new errors appear, referencing TypeScript files that I have completely removed from my project. Opening one of the files referenced in the error window, it appears that copies were made in <Project>\obj\Debug\...(path was longer but I forgot to record it)
  13. No amount of cleaning the solution gets rid of these files.
  14. Delete the entire objdirectory manually.
  15. Add all my original TypeScript files back into the project.
  16. Rebuild. Success!
  1. 从项目中删除所有 TypeScript 代码和定义文件。
  2. 打开packages.json 并删除其中的所有定义文件引用。
  3. 清洁和建造。没有错误或警告。
  4. 通过NuGet,安装你需要的定义文件(例如,对于jQuery,你需要的包是“jquery.TypeScript.DefinitelyTyped”)。
  5. 这将在 Scripts\typings\jquery 中安装定义文件。
  6. 对您引用的其他库执行相同操作。
  7. 添加一个新的测试 TypeScript 文件并添加尝试使用库的行,例如, var foo = $(document);
  8. 智能感知有效!项目建成!看来我们又恢复营业了!
  9. 没那么快。几秒钟后,我们再次收到重复标识符错误。似乎 Visual Studio 自己选择了定义文件(可能是通过我通过 NuGet 包含定义文件来激活的),现在我们再次发生冲突。
  10. 使用以下指令添加 tsconfig.js 文件,这会阻止 Visual Studio 下载自己的定义文件副本: { "compilerOptions": { "types": [] } }
  11. 错误消失了。
  12. 没那么快!几秒钟后,出现了数百个新错误,它们引用了我从项目中完全删除的 TypeScript 文件。打开错误窗口中引用的文件之一,似乎复制了<Project>\obj\Debug\...(路径更长但我忘记记录了)
  13. 没有多少清理解决方案可以摆脱这些文件。
  14. obj手动删除整个目录。
  15. 将我所有的原始 TypeScript 文件重新添加到项目中。
  16. 重建。成功!


UPDATE 2:I discovered some shortcomings with the approach above. I also have a better solution.

更新 2:我发现上述方法存在一些缺点。我也有更好的解决方案。

Using tsconfig.json has a major disadvantage. The option to recompile on save doesn't work within Visual Studio. I want to have my site running in debug mode, make some changes to the TypeScript, hit save, and then immediately see those changes reflected in the site.

使用 tsconfig.json 有一个主要缺点。保存时重新编译的选项在 Visual Studio 中不起作用。我想让我的站点在调试模式下运行,对 TypeScript 进行一些更改,点击保存,然后立即看到站点中反映的这些更改。

I think one of the things that was causing trouble for me was that I have my TypeScript files in a folder other than Scripts,which I reserve for files that should be deployed to the server as-is. I guess Microsoft considers this a non-standard use case.

我认为给我带来麻烦的一件事是,我将 TypeScript 文件保存在 Scripts 以外的文件夹中,我保留该文件夹用于应按原样部署到服务器的文件。我猜微软认为这是一个非标准用例。

After banging my head against the wall for way too long over this, I've found a simple, though hacky, solution. I took all the subdirectories in this directory:

在将我的头撞在墙上太久之后,我找到了一个简单但很笨拙的解决方案。我拿了这个目录下的所有子目录:

C:\Users\[me]\AppData\Local\Microsoft\TypeScript\node_modules\@types

and moved them to a directory called Deleted.

并将它们移动到名为 Deleted 的目录中。

Bam. No more automatic inclusion of definitions, no more errors.

砰。不再自动包含定义,不再有错误。

Microsoft, if you're reading, please provide support for my scenario, which, to reiterate is:

微软,如果你正在阅读,请为我的场景提供支持,重申一下:

  • TypeScript files stored in directory other than Scripts
  • Libraries (such as jQuery) included via reference to third-party CDN
  • Definition files for above libraries included directly via NuGet.
  • 存储在 Scripts 以外的目录中的 TypeScript 文件
  • 通过引用第三方 CDN 包含的库(例如 jQuery)
  • 通过 NuGet 直接包含上述库的定义文件。


UPDATE 3:I finally got it working. See the answer below for a non-hacky solution.

更新 3:我终于让它工作了。请参阅下面的答案以获取非 hacky 解决方案。

采纳答案by Brian Rak

I got it working with no hacks.The trick is to use a tsconfig.jsonfile and disable automatic definition inclusion. In my original question, I mentioned that I tried this and found I couldn't use compile-on-save. However, that was because I was trying to use the "watch" option, when I really should have been using the "compileOnSave" option.

我让它在没有黑客的情况下工作。诀窍是使用tsconfig.json文件并禁用自动定义包含。在我最初的问题中,我提到我尝试过这个并发现我无法使用 compile-on-save。然而,那是因为我试图使用“watch”选项,而我真的应该使用“compileOnSave”选项。

Here's my complete set of working steps to transform my original, broken project into one that works properly and will continue to work properly on an unmodified install of Visual Studio 2017.

这是我的完整工作步骤集,用于将我原来的、损坏的项目转换为一个可以正常工作的项目,并将继续在未修改的 Visual Studio 2017 安装上正常工作

Add a tsconfig.jsonfile to your project at the root.

tsconfig.json文件添加到您的项目的根目录中。

Configure your file with at least:

至少配置您的文件:

{ "compilerOptions": { "types": [] } }

but perhaps with other options as you like. My file looks like this:

但也许可以根据您的喜好选择其他选项。我的文件看起来像这样:

{
  "compileOnSave": true,
  "compilerOptions": {
    "types": [],
    "sourceMap": true,
    "target": "es5",
    "noEmitOnError": true
  }
}

You can learn about other compiler options here: https://www.typescriptlang.org/docs/handbook/compiler-options.html

您可以在此处了解其他编译器选项:https: //www.typescriptlang.org/docs/handbook/compiler-options.html

It's the "types":[]part that prevents the automatic inclusion of definitions.

"types":[]是防止自动包含定义的部分。

That means it's up to you to bring in definitions for whatever libraries you use. Fortunately, it's super easy via NuGet. For example, for jQuery, just search for jquery.TypeScript.DefinitelyTypedand install the appropriate version. This will create folders under Scripts/typings.

这意味着您可以为您使用的任何库引入定义。幸运的是,通过 NuGet 非常容易。例如,对于 jQuery,只需搜索jquery.TypeScript.DefinitelyTyped并安装相应的版本即可。这将在Scripts/typings.

If you were previously having errors, you might need to clear out some cruft. Clean your project, delete the objdirectory at the top of your project's directory structure, and it should now build correctly. I had a couple stray errors that went away when I typed something in the file and then saved again. A restart of Visual Studio might be in order too.

如果您以前遇到过错误,则可能需要清除一些杂物。清理您的项目,删除obj项目目录结构顶部的目录,现在应该可以正确构建。当我在文件中输入一些内容然后再次保存时,我有几个错误的错误消失了。也可能需要重新启动 Visual Studio。

Good luck!

祝你好运!



UPDATE:I discovered that when I publish to Azure, I got errors again. However, when I added the directives suggested by Perfabelow to my tsconfig.json file, deleted my bin and obj directories and restarted Visual Studio, those errors no longer appeared either. I've now built and rebuilt and published to Azure several times and they seem well and truly gone.

更新:我发现当我发布到 Azure 时,我再次出错。然而,当我加入所建议的指令Perfa下面我tsconfig.json文件,删除了我的bin和OBJ目录中并重新启动Visual Studio中,这些错误不再出现两种。我现在已经多次构建、重建和发布到 Azure,它们似乎已经完全消失了。

For clarity, my complete tsconfig.json file now looks like this:

为清楚起见,我的完整 tsconfig.json 文件现在如下所示:

{
  "compileOnSave": true,
  "compilerOptions": {
    "types": [],
    "sourceMap": true,
    "target": "es5",
    "noEmitOnError": true
  },
  "exclude": [
    "node_modules",
    "obj",
    "bin"
  ]
}

回答by Perfa

after installing VS 2017 I got this error. To get rid of it I updated my tsconfig.json exclude section with obj, and bin.

安装 VS 2017 后出现此错误。为了摆脱它,我用 obj 和 bin 更新了我的 tsconfig.json 排除部分。

"exclude": [
    "node_modules",
    "obj",
    "bin"
  ]

回答by Will Swope

I had this exact problem in an old app that I updated to VS 2017, and fixed it by following harley.333's answer -Modifying the Install to include TypeScript 2.0 SDK.

我在更新到 VS 2017 的旧应用程序中遇到了这个确切的问题,并通过遵循 harley.333 的回答 - 修改安装以包含 TypeScript 2.0 SDK 来修复它。

I don't have the rep to comment, but to find it, you have to flip the tab to "Individual Components", then it is on the last grouping, "SDKs, libraries and frameworks."

我没有要评论的代表,但要找到它,您必须将选项卡翻转到“单个组件”,然后它位于最后一个分组“SDK、库和框架”上。

Install Typescript SDK Screenshot

安装 Typescript SDK 截图