找不到模块角/动画

我在angular2使用的WebPack，当我尝试运行我的应用程序，我得到一个错误，说明找不到模块角/动画

找不到模块“@角/动画”

的package.json

{ 
    "name": "angular-quickstart", 
    "version": "1.0.0", 
    "description": "QuickStart package.json from the documentation, supplemented with testing support", 
    "scripts": { 
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ", 
    "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first", 
    "lint": "tslint ./app/**/*.ts -t verbose", 
    "lite": "lite-server", 
    "pree2e": "webdriver-manager update", 
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"", 
    "test-once": "tsc && karma start karma.conf.js --single-run", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "MIT", 
    "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", 
    "angular-in-memory-web-api": "~0.2.4", 
    "core-js": "^2.4.1", 
    "rxjs": "5.0.1", 
    "systemjs": "0.19.40", 
    "zone.js": "^0.7.4" 
    }, 
    "devDependencies": { 
    "awesome-typescript-loader": "^3.1.2", 
    "canonical-path": "0.0.2", 
    "concurrently": "^3.1.0", 
    "html-webpack-plugin": "^2.28.0", 
    "http-server": "^0.9.0", 
    "karma": "^1.3.0", 
    "karma-chrome-launcher": "^2.0.0", 
    "karma-cli": "^1.0.1", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "lite-server": "^2.2.2", 
    "lodash": "^4.16.4", 
    "primeng": "^4.0.0-rc.1", 
    "protractor": "~4.0.14", 
    "reflect-metadata": "^0.1.10", 
    "rimraf": "^2.5.4", 
    "tslint": "^3.15.1", 
    "typescript": "~2.0.10", 
    "typings": "^2.1.0", 
    "webpack": "^2.2.1" 
    }, 
    "repository": {}, 
    "main": "index.js" 
}

我webpack.config.js文件

var htmlWebPack = require('html-webpack-plugin'); 

module.exports = { 
    entry: "./app/main.ts", 
    output: { 
     path: 'dist', 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.tsx?$/, 
       loader: 'awesome-typescript-loader' 
      } 
     ] 
    }, 
    plugins: [ 
    new htmlWebPack({ 
     template: './index.html' 
    }) 
    ] 
};

当我运行像npm start这样的命令时，我得到上面提到的错误。

更新1

我甚至试图使用该命令

NPM安装到安装角动画角动画

这是错误消息我得到我还尝试使用命令

卸载角动画

NPM卸载角动画

但它不帮我:(

来源

2017-03-17 Lijin Durairaj

执行下面的步骤，使其工作：

故宫从 “@角/平台的浏览器/动画” 安装@角/动画@最新--save
进口 “BrowserAnimationsModule”在你的根NgModule（没有这个，你的代码将编译和运行，但动画会触发一个错误）
在你的组件中使用像这样的新包导入 - “import {trigger，state，style，transition，动画}来自'@角/动画'; “

这为我工作

来源

2017-04-08 07:19:07 Hamit

@角/ animimations在4.0.0版（发布候选版）进行了介绍。你需要更新到angular4。

来源

2017-03-17 12:26:59 pixelbits

将更新到角4影响我其他的设定，也即。组件和模块。或将卸载角度/动画将工作？ –

角使用语义版本。当有一些重大变化时，他们会增加主要版本（2到4）。但是，它不是像从ng1到ng2那样完整的重写。要么删除动画模块或升级 - 两者都应该适合你。 – pixelbits

我已经更新了最新版本的问题，请看看它，谢谢您的帮助 –

看起来像角2，这是核心的一部分，如archived documentation所示：

import { Component, Input, trigger, state, style, transition, animate } from '@angular/core';

来源

2017-03-25 01:35:34 Brendan

你是在正确的轨道上，但只是接近！你可以在这个discussion here看到，动画是从核心中取出来的。此外，连字符名称显然正在被废除 - 所以角动画现在是@角度/动画，就像@ angular/angular-cli已经变成@ angular/cli一样。

因此，以（希望）解决您的问题 - 你应该做到以下几点：在你的项目

更新到角4。您需要在为了做到这一点运行以下命令：npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest --save和你还需要与npm install [email protected] --save

这应该做的伎俩更新打字稿。

如果它不是做的伎俩，我会建议检查你的json包，并确保你在所有的核心方面与现在分开的动画片段一起碰撞到4.0。然后，删除节点模块文件夹，清空缓存，并运行一个干净的安装与更新包，像这样：

>$ rm -rf node_modules 
>$ npm cache clear 
>$ npm install

这是一个有点紧张的，现在有很多不同的人造成了很大的变化的和修正的核心功能集，并然后角的其他部分被赶上了核心，所以我会建议你在任何项目小心前进，在很有条理的步骤，这样就可以解决这一来问题一个接一个（并且更容易找到/修复）。

希望这会有所帮助！

来源

2017-03-27 02:59:59 metavurt

谢谢，@TobySpeight，我应该第一次想到！我现在想到了尽可能多的有用解决方案。 – metavurt

我做了这个步骤：

https://github.com/mgechev/angular-seed/issues/1880#issuecomment-290557768

我还要举：

我有同样的问题，从升级2.0到4.0。最后我错过了我的systemjs.config.js中的以下内容：

'@角/动画'： 'NPM：@角/动画/捆绑/ animations.umd.js'，
'@角/动画/浏览器'： “NPM：@角/动画/捆绑/动画-browser.umd.js'，
'@角/平台的浏览器/动画'： 'NPM：@角/平台的浏览器/捆绑/平台的浏览器的animations.umd.js'，

起初我有第一和第三行 - 一旦我为@ angular /动画/浏览器添加第二行，所有事情都开始工作。

这个工作对我来说，我可以看到固定大多数情况下。

来源

2017-05-18 01:01:25

嗨，它在angular-cli项目中的systemjs.config.js在哪里？谢谢 – Hazlo8

角度cli我认为它不存在。 –

您必须导入角动画模块是这样的：

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';import {trigger,state,style,animate,transition}from '@angular/animations';

来源

2017-09-08 09:15:16

找不到模块角/动画

回答

相关问题