DEV Community


Posted on

Stencil doesn't start app-roote HELP!

I'm building an electron app with stencil. I have the newest version but Electron starts with index.html instead of app-home.tsx. Also I get an error for a JSX.Element but I don't know why. Maybe this is the reason why. May you could help me? I don't know what to do. Did I do sth wrong? I have updatet stencil-router, stencil-core and stencil itself. I doesn't start app-roote.tsx.


import { Component, h } from '@stencil/core';

  tag: 'app-root',
  styleUrl: 'app-root.css',
  shadow: true
export class AppRoot {

  render() {
    return (

          <stencil-router historyType="hash">
            <stencil-route-switch scrollTopOffset={0}>
              <stencil-route url='/' component='app-home' exact={true} />
              <stencil-route url='/profile/:name' component='app-profile' />
              <stencil-route url='/bewertung' component='app-bewertung' />


import '../stencil.core';
import { FunctionalComponent } from "../stencil.core";
import { SubscribeCallback } from '../declarations';
declare function defaultConsumerRender(subscribe: SubscribeCallback<string>, renderer: Function): JSX.Element; //there is the error and in all JSX 
export declare function createProviderConsumer<T extends object>(defaultState: T, consumerRender?: typeof defaultConsumerRender): {
    Provider: FunctionalComponent<{
        state: T;
    Consumer: FunctionalComponent<{}>;
    wrapConsumer: (childComponent: any, fieldList: Extract<keyof T, string>[]) => ({ children, ...props }: any) => JSX.Element;
    injectProps: (childComponent: any, fieldList: Extract<keyof T, string>[]) => void;
export {};


<!DOCTYPE html>
<html dir="ltr" lang="en">
  <meta charset="utf-8">
  <title>Stencil Starter App</title>
  <meta name="Description" content="Welcome to the Stencil App Starter. You can use this starter to build entire apps all with web components using Stencil!">
  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, minimum-scale=1.0, maximum-scale=8.0">
  <meta name="theme-color" content="#16161d">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta http-equiv="x-ua-compatible" content="IE=Edge"/>
  <link href="/Praesentationsbewerter/stencil-electron-st/src/global/app.css" rel="stylesheet">
  <script src="/build/app.js"></script>

  <link rel="apple-touch-icon" href="/assets/icon/icon.png">
  <link rel="icon" type="image/x-icon" href="/assets/icon/favicon.ico">
  <link rel="manifest" href="/manifest.json">



import { Component, h } from '@stencil/core';

  tag: 'app-home',
  styleUrl: 'app-home.css',
  shadow: true
export class AppHome {

  render() {
    return (
      <div class='app-home'>
          Herzlich Willkommen beim Präsentationsbewerter

        <stencil-route-link url='/profile/stencil'>

Discussion (0)