我在我的项目中使用我自己的主题。如果我下载一个新项目,并在“前端”目录中创建自己的主题,它就完美了。
当我更改为我的应用程序时,每次打开它都会显示...
TypeError:无法访问属性“appendChild”,n.shadowRoot 为空
在我有@Theme(Lumo.class)的课程中,我将其更改为我自己的主题@Theme(themeFolder = "eo-vaadin-orange")。
我在 package.json 中添加了 lumo-css-framework ...
我在前端目录中创建了主题...
并创建我自己的styles.css ...
我跑起来了,但每次我得到这个¿javascript?错误。
有任何想法吗?
谢谢
==== 更新 ======
在 webpack 捆绑主题中的所有 javascript 类之后,我只使用 shadowRoot ...
这是我的 package.json 文件...
{
"name": "no-name",
"license": "UNLICENSED",
"vaadin": {
"dependencies": {
"lit-element": "2.5.1",
"@polymer/polymer": "3.2.0",
"@webcomponents/webcomponentsjs": "^2.2.10",
"@vaadin/vaadin-grid": "5.7.13",
"@vaadin/vaadin-icons": "4.3.2",
"@vaadin/vaadin-split-layout": "4.3.0",
"@vaadin/vaadin-combo-box": "5.4.7",
"@polymer/paper-behaviors": "^3.0.0-pre.27",
"@vaadin/vaadin-core-shrinkwrap": "14.6.1",
"@vaadin/vaadin-upload": "4.4.1",
"@polymer/iron-behaviors": "^3.0.0-pre.26",
"@vaadin/vaadin-dialog": "2.5.2",
"@vaadin/vaadin-select": "2.4.0",
"@polymer/iron-a11y-keys-behavior": "^3.0.0-pre.26",
"@vaadin/vaadin-app-layout": "2.2.0",
"@vaadin/vaadin-item": "2.3.0",
"@vaadin/vaadin-notification": "1.6.1",
"@vaadin/vaadin-progress-bar": "1.3.0",
"@vaadin/vaadin-date-time-picker": "1.4.0",
"@vaadin/vaadin-ordered-layout": "1.4.0",
"@vaadin/vaadin-login": "1.2.0",
"@vaadin/vaadin-button": "2.4.0",
"@vaadin/vaadin-date-picker": "4.4.1",
"@vaadin/vaadin-text-field": "2.8.4",
"@vaadin/vaadin-menu-bar": "1.2.2",
"@vaadin/vaadin-custom-field": "1.3.0",
"@vaadin/vaadin-form-layout": "2.3.0",
"@polymer/iron-list": "3.1.0",
"@vaadin/vaadin-accordion": "1.2.0",
"@vaadin/vaadin-list-box": "1.4.0",
"@polymer/iron-flex-layout": "^3.0.0-pre.26",
"@vaadin/vaadin-checkbox": "2.5.0",
"@vaadin/vaadin-details": "1.2.0",
"@polymer/iron-icon": "3.0.1",
"@vaadin/vaadin-time-picker": "2.4.0",
"@vaadin/vaadin-context-menu": "4.5.0",
"@vaadin/vaadin-avatar": "1.0.4",
"@polymer/paper-styles": "^3.0.0-pre.26",
"@polymer/paper-progress": "^3.0.0-pre.26",
"@polymer/iron-form-element-behavior": "^3.0.0-pre.26",
"ace-builds": "1.4.11",
"@vaadin/vaadin-radio-button": "1.5.1",
"@vaadin/vaadin-tabs": "3.2.0",
"@vaadin/vaadin-lumo-styles": "1.6.0",
"@polymer/paper-input": "^3.0.0-pre.26",
"@vaadin/vaadin-material-styles": "1.3.2",
"multiselect-combo-box": "2.4.2",
"lit-html": "1.4.1"
},
"devDependencies": {
"webpack-babel-multi-target-plugin": "2.3.3",
"copy-webpack-plugin": "5.1.2",
"compression-webpack-plugin": "4.0.1",
"raw-loader": "3.1.0",
"webpack-cli": "3.3.11",
"webpack": "4.42.0",
"chokidar": "^3.5.0",
"webpack-merge": "4.2.2",
"webpack-dev-server": "3.11.0",
"ts-loader": "8.0.12",
"typescript": "4.0.3",
"css-loader": "4.2.1",
"file-loader": "6.1.0",
"extra-watch-webpack-plugin": "1.0.3",
"lit-css-loader": "0.0.4",
"construct-style-sheets-polyfill": "2.4.6",
"extract-loader": "5.1.0"
},
"hash": "28d13379629acf9d66c70f26c453a26d2ee9c64e8b2ebb944fe35289c7ac1656"
},
"dependencies": {
"lit-element": "2.5.1",
"@polymer/polymer": "3.2.0",
"@webcomponents/webcomponentsjs": "^2.2.10",
"@vaadin/vaadin-grid": "5.7.13",
"@vaadin/vaadin-icons": "4.3.2",
"@vaadin/vaadin-split-layout": "4.3.0",
"@vaadin/vaadin-combo-box": "5.4.7",
"@polymer/paper-behaviors": "^3.0.0-pre.27",
"@vaadin/vaadin-core-shrinkwrap": "14.6.1",
"@vaadin/vaadin-upload": "4.4.1",
"@polymer/iron-behaviors": "^3.0.0-pre.26",
"@vaadin/vaadin-dialog": "2.5.2",
"@vaadin/vaadin-select": "2.4.0",
"@polymer/iron-a11y-keys-behavior": "^3.0.0-pre.26",
"@vaadin/vaadin-app-layout": "2.2.0",
"@vaadin/vaadin-item": "2.3.0",
"@vaadin/vaadin-notification": "1.6.1",
"@vaadin/vaadin-progress-bar": "1.3.0",
"@vaadin/vaadin-date-time-picker": "1.4.0",
"@vaadin/vaadin-ordered-layout": "1.4.0",
"@vaadin/vaadin-login": "1.2.0",
"@vaadin/vaadin-button": "2.4.0",
"@vaadin/vaadin-date-picker": "4.4.1",
"@vaadin/vaadin-text-field": "2.8.4",
"@vaadin/vaadin-menu-bar": "1.2.2",
"@vaadin/vaadin-custom-field": "1.3.0",
"@vaadin/vaadin-form-layout": "2.3.0",
"@polymer/iron-list": "3.1.0",
"@vaadin/vaadin-accordion": "1.2.0",
"@vaadin/vaadin-list-box": "1.4.0",
"@polymer/iron-flex-layout": "^3.0.0-pre.26",
"@vaadin/vaadin-checkbox": "2.5.0",
"@vaadin/vaadin-details": "1.2.0",
"@polymer/iron-icon": "3.0.1",
"@vaadin/vaadin-time-picker": "2.4.0",
"@vaadin/vaadin-context-menu": "4.5.0",
"@vaadin/vaadin-avatar": "1.0.4",
"@polymer/paper-styles": "^3.0.0-pre.26",
"@polymer/paper-progress": "^3.0.0-pre.26",
"@polymer/iron-form-element-behavior": "^3.0.0-pre.26",
"ace-builds": "1.4.11",
"@vaadin/vaadin-radio-button": "1.5.1",
"@vaadin/vaadin-tabs": "3.2.0",
"@vaadin/vaadin-lumo-styles": "1.6.0",
"@polymer/paper-input": "^3.0.0-pre.26",
"@vaadin/vaadin-material-styles": "1.3.2",
"multiselect-combo-box": "2.4.2",
"lit-html": "1.4.1",
"lumo-css-framework": "^3.0.11"
},
"devDependencies": {
"webpack-babel-multi-target-plugin": "2.3.3",
"copy-webpack-plugin": "5.1.2",
"compression-webpack-plugin": "4.0.1",
"raw-loader": "3.1.0",
"webpack-cli": "3.3.11",
"webpack": "4.42.0",
"chokidar": "^3.5.0",
"webpack-merge": "4.2.2",
"webpack-dev-server": "3.11.0",
"ts-loader": "8.0.12",
"typescript": "4.0.3",
"css-loader": "4.2.1",
"file-loader": "6.1.0",
"extra-watch-webpack-plugin": "1.0.3",
"lit-css-loader": "0.0.4",
"construct-style-sheets-polyfill": "2.4.6",
"extract-loader": "5.1.0"
}
}
Thankssss