Pic Mickael Pic Mickael -3 years ago 134
React JSX Question

React: "Warning: Unknown DOM property itemscope. Did you mean itemScope?"

I am using React 15.6.1 and trying to insert some Microdata into my text:

<div itemScope itemType="http://schema.org/VideoGame">


But I keep seeing the following warning in the console:


Warning: Unknown DOM property itemscope. Did you mean itemScope?


According to this, it should work.

Anyone could help me and figure out what is wrong?
Is my version of React too old or do I have to define a flag somewhere to get it to work ?

This is my package.json: (I am using npm start to debug, and npm run build to deploy)

{
"name": "P",
"version": "0.1.0",
"description": ".",
"private": true,
"devDependencies": {
"babel-plugin-react-html-attrs": "^2.0.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-polyfill": "^6.23.0",
"babel-preset-stage-2": "^6.24.1",
"babili-webpack-plugin": "^0.1.2",
"compression-webpack-plugin": "^1.0.0",
"react-hot-loader": "^1.3.1",
"react-scripts": "1.0.10",
"serve-favicon": "^2.4.3",
"webpack-dev-server": "^2.5.1",
"webpack-hot-middleware": "^2.18.2"
},
"dependencies": {
"axios": "^0.16.2",
"babel-core": "^6.25.0",
"babel-loader": "^7.1.1",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-polyfill": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-preset-stage-2": "^6.3.13",
"circular-dependency-plugin": "^3.0.0",
"classnames": "^2.2.5",
"clean-webpack-plugin": "^0.1.16",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.4",
"dotenv": "^4.0.0",
"es6-promise": "^4.1.1",
"file-loader": "^0.11.2",
"firebase": "^4.1.3",
"history": "^4.6.3",
"immutable": "^3.8.1",
"invariant": "^2.2.2",
"isomorphic-fetch": "^2.2.1",
"jsdom": "^11.1.0",
"jsonwebtoken": "^7.4.1",
"konva": "^1.6.3",
"less-loader": "^4.0.5",
"react": "^15.6.1",
"react-addons-css-transition-group": "^15.6.0",
"react-async-script": "^0.9.1",
"react-async-script-loader": "^0.3.0",
"react-bootstrap": "^0.31.1",
"react-dnd": "^2.4.0",
"react-dnd-html5-backend": "^2.4.1",
"react-dom": "^15.6.1",
"react-fontawesome": "^1.6.1",
"react-ga": "^2.2.0",
"react-google-recaptcha": "^0.9.6",
"react-gravatar": "^2.6.3",
"react-helmet": "^5.1.3",
"react-input-range": "^1.2.1",
"react-konva": "^1.1.3",
"react-modal": "^2.2.2",
"react-page-click": "^4.0.1",
"react-recaptcha": "^2.3.2",
"react-redux": "^5.0.5",
"react-router": "^3.0.2",
"react-router-redux": "^4.0.0",
"redux": "^3.7.2",
"redux-form": "^7.0.1",
"redux-logger": "^2.3.2",
"redux-thunk": "^2.2.0",
"rimraf": "^2.6.1",
"single-module-instance-webpack-plugin": "0.0.4",
"style-loader": "^0.18.2",
"superagent": "^3.5.2",
"webpack": "^3.3.0",
"webpack-bundle-analyzer": "^2.9.0",
"xml2js": "^0.4.17",
"xmldom": "^0.1.27",
"xpath": "0.0.24"
},
"scripts": {
"start": "node devServer.js --progress --verbose",
"clean": "rimraf ./dist",
"dev": "webpack -d --watch --progress --display-error-details --display-reasons",
"start1": "webpack-dev-server --config ./webpack.config.comphotdeploy -d --progress --colors --host localhost --port 28080 --hot --inline --content-base src",
"builddev": "webpack -d --progress --display-error-details --display-reasons",
"build": "webpack -p --progress --verbose",
"dist": "rimraf ./dist&&webpack -d --display-error-details --display-reasons",
"start-react": "SET PORT=9999&&SET DEVTOOL=source-map&&react-scripts start",
"build-react": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "./node_modules/react-scripts/config/eslint.js"
}
}

Answer Source

Finally found the problem, one of the itemScope was declared as itemscope. I did not see it because it was outside of the editor window as part of a long string.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download