找不到模塊角/動畫

我在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

找不到模塊角/動畫

回答

相關問題