找不到模块角度/动画 [英] Cannot find module angular/animations
问题描述
我在angular2中使用了webpack,当我尝试运行我的应用时,出现错误提示
I am using webpack in angular2 and when i try to run my app i get an error stating
找不到模块"@ angular/animations"
Cannot find module "@angular/animations"
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文件是
my webpack.config.js file is
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之类的命令时,出现如上所述的错误.
when i run the command like npm start, i get an error as mentioned above.
更新1
我什至尝试使用此命令安装angular-animate
i even tried to install angular-animate using this command
npm安装角度动画
npm install angular-animate
这是我收到的错误消息 我还尝试使用命令卸载angular-animate
this is the error message i get I also tried to uninstall angular-animate with the command
npm卸载角动画
npm uninstall angular-animate
但这对我没有帮助:(
推荐答案
执行以下步骤使其生效:
Perform below steps to make it work:
-
npm install @ angular/animations @ latest --save
npm install @angular/animations@latest --save
从根目录NgModule中的"@ angular/platform-browser/animations"导入"BrowserAnimationsModule"(如果没有此功能,则代码将编译并运行,但是动画会触发错误)
import "BrowserAnimationsModule" from "@angular/platform-browser/animations" in your root NgModule (Without this, your code will compile and run, but animations will trigger an error)
在您的组件中使用从新程序包中的导入,例如-从'@ angular/animations'导入{触发,状态,样式,过渡,动画};"
In your component use imports from the new package like this - " import { trigger, state, style, transition, animate } from '@angular/animations'; "
这对我有用.
这篇关于找不到模块角度/动画的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!