TS无法找到模块“@angular/platform-browser”。

Question

文件图像

我遇到了这个错误，但无法找出原因。我正在尝试导入angular/core和angular/platform-browser。我查看了许多来自stackoverflow的链接，但都没有帮助到我。

这是我的package.json 文件

{   "name": "angular-2",   "version": "1.0.0",   "scripts": {
    "start": "concurrently \"npm run tsc:w\" \"npm run lite\" ",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "typings": "typings",
    "postinstall": "typings install"   },   "license": "ISC",   "dependencies": {
    "angular2": "2.0.0-beta.13",
    "systemjs": "0.19.25",
    "es6-shim": "^0.35.0",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.2",
    "@angular/router":  "3.0.0-alpha.7",
    "zone.js": "0.6.6"
       },   "devDependencies": {
    "concurrently": "^2.0.0",
    "lite-server": "^2.1.0",
    "typescript": "^1.8.9",
    "typings":"^0.7.11"   } }

- Shehram Tahir

---

我认为，为了验证您的导入是否正确，如果您能分享您的package.json文件，那将是很好的。 - Ricardo Cunha

@Ricardo，我已经添加了 package.json 文件。 - Shehram Tahir

请从此链接 https://github.com/angular/quickstart/blob/master/package.json 更新您的 package.json 文件。 - Ahmar

更新后仍显示相同的错误。 - Shehram Tahir

Answer 1

我认为你需要在你的package.json中安装并添加@angular/platform-browser，你可以这样做：

npm install @angular/platform-browser --save

所以，目前Angular2已经有了最终版本，您不需要使用beta版本。 您将项目标记为类似于ionic2的项目，但它看起来不像一个普通的ionic2应用程序，因为您的package.json中没有任何ionic / cordova依赖项。

- Ricardo Cunha

---

Ricardo，我同意。 你需要安装所有缺失的内容： sudo npm i @angular/core@<version> sudo npm i @angular/compiler@<version> sudo npm i @angular/platform-browser-dynamic@<version> - GenTech

这个对我的问题有所帮助，针对你的项目安装目录运行以上命令。感谢您！ - petey m

Answer 2

我经历过同样的问题，这里有一个有效的解决方案。

我假设您已经生成了一个 Angular CLI 项目，在开始编码后遇到了这个问题。

解决方案

有时候 Angular 无法安装所有必需的依赖项，甚至在 npm install 后也无法更新。

步骤如下：

1. Delete existing folders @angular & @angular-devkit inside node_modules folder
2. perform npm install, or yarn

这个方法适用于几乎所有情况，至少在我的几次尝试中都行得通。

- Zest

Answer 3

尝试运行

npm install -g @angular/cli

如果仍然出现错误，请关闭并重新打开您的编辑器。我在将我的现有项目的src复制并放置在新创建的cli项目中时（为了避免再次创建新组件）在Visual Studio中遇到了这个问题。

- T. Shashwat

---

关闭并重新打开您的编辑器！！！！！！ 我花了几个小时才找到这个答案。 - אברימי פרידמן

花了好几个小时寻找解决方案，然后突然间！！！你的答案拯救了这一天。谢谢你。 - Dev Enock

Answer 4

有可能是因为依赖项没有正确安装，或者您需要重新安装它们。我曾经遇到过类似的问题，所有这些答案都很好。

请在您的终端中尝试：

npm install --save @angular/platform-browser

npm install --save @angular/core

希望这能够正常工作！

- Jordan

Answer 5

我也遇到了这个问题，删除节点模块文件夹，然后使用>npm cache clean --force清除缓存。 再次全局安装节点模块 npm install --save @ng-bootstrap/ng-bootstrap npm install --legacy-peer-deps

它会起作用的。

- APARNA PATHAK

---

嗨，Aparna。感谢你的回答！只是一个建议：stackoverflow支持代码块。您可以使用它们使您的答案更清晰，并将您提到的命令放在代码块中。 - viniciusjssouza

Answer 6

尝试重新安装 @types/node：

npm uninstall --save-dev @types/node
npm install --save-dev @types/node

如果这不起作用，请尝试使用 TypeScript：

npm uninstall --save-dev typescript
npm install --save-dev typescript

- Yekke

Answer 7

你可以在终端中尝试以下命令。

命令列表：

sudo npm install -g @angular/forms --save
sudo npm install -g @angular/core --save 
sudo npm install -g @angular/platform-browser --save

sudo 用于给当前 Angular 项目文件夹提供 root 访问权限，-g 用于全局安装。

- Rajnish Pandey

Answer 8

根据您的 package.json 文件，您正在使用较旧版本的 Angular2。

"angular2": "2.0.0-beta.13"

您需要在您的 package.json 中使用以下依赖项。

  "dependencies": {
    "@angular/common": "~2.4.0",
    "@angular/compiler": "~2.4.0",
    "@angular/core": "~2.4.0",
    "@angular/forms": "~2.4.0",
    "@angular/http": "~2.4.0",
    "@angular/platform-browser": "~2.4.0",
    "@angular/platform-browser-dynamic": "~2.4.0",
    "@angular/router": "~3.4.0",

请注意 - 从angular2 2.0.0-rc.0版本开始，他们移动到了作用域包，因此您将看到@angular/<packagename>。在此之前，它是angular2。请参考info。

有关最新版本，请参阅link。

- Sanket

---

我已经更新了我的依赖，但是错误还是一样的。 - Shehram Tahir

更新依赖后，您是否运行了 npm install 命令？ - Sanket

Answer 9

我通过对tsconfig文件进行更改找到了答案。

 {
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

我还更新了package.json文件。

- Shehram Tahir

---

你需要对 tsconfig 文件进行哪些更改？是哪个设置出了问题，或者你添加了哪些设置？另外，你在 package.json 文件中更新了什么？ - Zoran Pavlovic

Answer 10

您可以使用ng update命令来更新您的应用程序及其依赖项，如下所示：

ng update --all=true --force

在这里，将所有标志都设置为 true 以更新所有依赖项，并使用强制标志来强制执行它，如其名称所示。现在，在这样做之后，您可能会遇到一些依赖性漏洞，可以通过手动安装这些依赖项来修复。

- singh95ravindra