[英]Angular - TypeError: Cannot read property 'nodeName' of null
我更新了我的项目的很多依赖项,它基于最近发布新版本的主题,我用这个新版本更新了我的项目。
问题是,更新后我遇到了很多问题(正如我所料),但是在修复了所有编译器问题后,我发现自己遇到了这个错误:
错误:
错误错误:未捕获(承诺):TypeError:无法读取 null 的属性 'nodeName' TypeError:无法在 eval 中读取 null 的属性 'nodeName'(eval at webpackJsonp.../../../../script- loader/addScript.js.module.exports ( http://localhost:4200/0.chunk.js:6326:8 ), :159:258)
我的 package.json:
{
"name": "projectName",
"version": "1.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"build:dev": "./node_modules/.bin/ng build",
"build:prod": "./node_modules/.bin/ng build --prod --aot=false",
"build:aot": "./node_modules/.bin/ng build --prod --aot",
"build:aot2": "node --max_old_space_size=4096 ./node_modules/.bin/ng build --prod --aot",
"build": "npm run build:dev",
"clean:dist": "npm run rimraf -- dist",
"clean:install": "npm set progress=false && npm install",
"clean:start": "npm start",
"clean": "npm cache clean && npm run rimraf -- node_modules doc coverage dist",
"e2e:live": "npm run e2e -- --elementExplorer",
"e2e": "npm run protractor",
"lint": "npm run tslint \"src/**/*.ts\"",
"postversion": "git push && git push --tags",
"prebuild:dev": "npm run clean:dist",
"prebuild:prod": "npm run clean:dist",
"preclean:install": "npm run clean",
"preclean:start": "npm run clean",
"preversion": "npm test",
"protractor": "protractor",
"rimraf": "rimraf",
"server:dev": "./node_modules/.bin/ng serve",
"server": "npm run server:dev",
"start": "npm run server:dev",
"test": "./node_modules/.bin/ng test",
"tslint": "tslint",
"typedoc": "typedoc",
"version": "npm run build",
"ng": "ng",
"pree2e": "webdriver-manager update --standalone false --gecko false"
},
"private": true,
"dependencies": {
"@angular-redux/store": "^6.4.5",
"@angular/animations": "^4.2.2",
"@angular/cli": "^1.1.1",
"@angular/common": "^4.2.2",
"@angular/compiler": "^4.2.2",
"@angular/compiler-cli": "^4.2.2",
"@angular/core": "^4.2.2",
"@angular/forms": "^4.2.2",
"@angular/http": "^4.2.2",
"@angular/platform-browser": "^4.2.2",
"@angular/platform-browser-dynamic": "^4.2.2",
"@angular/router": "^4.2.2",
"X-editable": "github:vitalets/x-editable",
"angular-2-dropdown-multiselect": "^1.3.2",
"bootstrap": "3.3.7",
"bootstrap-colorpicker": "2.5.1",
"bootstrap-duallistbox": "3.0.6",
"bootstrap-markdown": "2.10.0",
"bootstrap-progressbar": "0.9.0",
"bootstrap-slider": "^9.8.0",
"bootstrap-tagsinput": "0.7.1",
"bootstrap-timepicker": "0.5.2",
"chart.js": "2.6.0",
"classlist.js": "^1.1.20150312",
"clockpicker": "0.0.7",
"clone": "2.1.1",
"core-js": "2.4.1",
"debounce": "^1.0.2",
"dropzone": "^5.1.0",
"dygraphs": "2.0.0",
"fuelux": "^3.16.0",
"he": "1.1.1",
"highcharts": "5.0.12",
"intl": "^1.2.5",
"ion-rangeslider": "2.1.7",
"jquery": "^3.2.1",
"jquery-color": "1.0.0",
"jquery-jcrop": "0.9.13",
"jquery-knob": "1.2.11",
"jquery-ui-npm": "1.12.0",
"jquery-validation": "1.16.0",
"jquery.maskedinput": "1.4.1",
"markdown": "0.5.0",
"morris.js": "0.5.0",
"ng2-datetime": "https://github.com/elt/ng2-datetime/tarball/dynamic_template",
"ng2-logger": "^1.0.3",
"ngx-bootstrap": "^1.7.1",
"ngx-popover": "0.0.16",
"nouislider": "10.0.0",
"raphael": "2.2.7",
"redux": "^3.6.0",
"rxjs": "^5.4.0",
"scriptjs": "2.5.8",
"select2": "4.0.3",
"smartadmin-plugins": "^1.0.20",
"summernote": "^0.8.4",
"to-markdown": "3.0.4",
"ts-helpers": "1.1.2",
"web-animations-js": "^2.2.5",
"webpack": "^2.6.1",
"zone.js": "0.8.12"
},
"devDependencies": {
"@types/jasmine": "2.5.52",
"@types/jquery": "2.0.46",
"@types/node": "7.0.31",
"codelyzer": "3.0.1",
"css-loader": "0.28.4",
"exports-loader": "0.6.4",
"expose-loader": "0.7.3",
"file-loader": "0.11.2",
"imports-loader": "0.7.1",
"jasmine-core": "2.6.3",
"jasmine-spec-reporter": "4.1.0",
"karma": "1.7.0",
"karma-chrome-launcher": "2.1.1",
"karma-cli": "1.0.1",
"karma-coverage-istanbul-reporter": "1.3.0",
"karma-jasmine": "1.1.0",
"karma-jasmine-html-reporter": "0.2.2",
"karma-remap-istanbul": "0.6.0",
"protractor": "5.1.2",
"raw-loader": "0.5.1",
"script-loader": "^0.7.0",
"style-loader": "0.18.2",
"ts-node": "3.0.6",
"tslint": "5.4.3",
"typescript": "2.3.4",
"url-loader": "0.5.9"
},
"engines": {
"node": ">= 4.2.1",
"npm": ">= 3"
}
}
在绝望的尝试中,我重新安装了: script-loader
依赖项,只是为了确定。
我很无能,任何提示或建议甚至解决方案都将不胜感激!
谢谢指教!
更新 1:
我已经发布了我在控制台中发现的错误的更清晰和更新的图像。
当我点击这些错误(见代码行 6329)时,我会到这里:
如果有人知道导致错误的原因,或者甚至知道调试它并找到问题的好方法,那将有很大帮助!
我发现了问题: DataTables
。
我正在使用 DataTables 库,并且在表的初始化方面遇到了问题。
我还无法修复 DataTables 问题,但这是错误的根源。
因此,为了使这个问题有用并且不要删除它,我将解释我是如何得出这个结论的:
TypeError: Cannot read property 'nodeName' of null
在 jQuery 中是典型的,所以,开始在你的主要 jQuery 库中搜索是一个不错的选择。node_modules
并在控制台中键入npm install
可能会有所帮助(即使很激烈,但对我有帮助)。我希望这可以帮助那些被这个问题困扰了一段时间的人。
Breaking my App to find the issue 我发现很多库都会抛出这个错误,它们都是基于 jQuery 的库。
祝你好运!
确保您的表在 thead、tbody、tfoot 中具有相同的元素计数。 如果您有 10 个标题、10 个正文列,但有 9 个页脚,它将找不到页脚节点,您将看到错误。 常见的错误是添加额外的列,但忘记添加页脚(如果有)。
我在迁移过程中使用混合应用程序(AngularJS 和 Angular)时遇到了这个问题。
在我的降级文件中,一个组件被声明了两次:
angular.module('myApp')
...
.directive(
'myDowngradedComponent',
downgradeComponent({ component: myDowngradedComponent }) as angular.IDirectiveFactory
)
...
.directive(
'myDowngradedComponent',
downgradeComponent({ component: myDowngradedComponent }) as angular.IDirectiveFactory
)
...
tfoot
列的数量与thead
列的数量不匹配。 这很可能是问题所在。
参考: https : //datatables.net/forums/discussion/50611/cannot-read-property-nodename-of-null-when-i-am-adding-row-in-tfoot
谢谢
从DataTable({...})
删除responsive: true
(我不再使用的属性DataTable({...})
修复了它。
package.json
:
...
"datatables.net-bs4": "^1.10.20",
"datatables.net-responsive-bs4": "^2.2.3",
"datatables.net-rowgroup-bs4": "^1.1.1",
...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.