# Fresh development installation

**URL:** <https://community.gladysassistant.com/t/fresh-development-installation/5785>\
**Category:** Développement\
**Created:** [November 25, 2020, 4:20am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785 "2020-11-25T04:20:38Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 4:20am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/1 "2020-11-25T04:20:38Z")

</div>

Hi all. I have trouble loading the front built from git.

I cloned the repo; did ‘npm install’ in the front and server folders. Both front and server started successfully on ports 1444 and 1443 respectively. However, when I access front I get an JS error:

```nohighlight
    TypeError: Cannot read property 'default' of undefined
    at rankChild (preact-router.es.js?f128:82)
    at prepareVNodeForRanking (preact-router.es.js?f128:65)
    at Array.filter (<anonymous>)
    at Router.getMatchingChildren (preact-router.es.js?f128:303)
    at Router.canRoute (preact-router.es.js?f128:258)
    at canRoute (preact-router.es.js?f128:145)
    at route (preact-router.es.js?f128:134)
    at eval (main.js?5c4e:49)

```

Front correctly requires the latest version of preact-router (v3.2.1). However, dev dependency preact-cli 2.x requires preact-router version 2.x which in turn creates this problem.

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 4:44am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/2 "2020-11-25T04:44:27Z")

</div>

Error line:

```auto
  function rankChild(vnode) {
    vnode.attributes.default ? 0 : rank(vnode.attributes.path); // <- error here
  }

```

Newer preact-router version is:

```auto
    function rankChild(vnode) {
	return vnode.props.default ? 0 : rank(vnode.props.path);
    }

```

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 5:09am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/3 "2020-11-25T05:09:24Z")

</div>

I resolved this by updating preact-cli to v3 and some other minor updates (removal of preact-cli-plugin-fast-async - it’s not compatible with latest webpack).

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 5:43am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/4 "2020-11-25T05:43:34Z")

</div>

Now I can’t complete the signup form: it doesn’t like {’ '} code here [Gladys/ConfigureHouseTab.jsx at a8f98aeccac48255a3b794695b972d2c0e7ab1b8 · GladysAssistant/Gladys · GitHub](https://github.com/GladysAssistant/Gladys/blob/a8f98aeccac48255a3b794695b972d2c0e7ab1b8/front/src/routes/signup/4-configure-house/ConfigureHouseTab.jsx#L71)

If I remove it issue disappears.

---

<div class="post-metadata">

**Author:** ![VonOx](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/vonox/32/10128_2.png) [@VonOx](https://community.gladysassistant.com/u/VonOx)\
**Post date:** [November 25, 2020, 9:34am UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/5 "2020-11-25T09:34:18Z")

</div>

Hi @siburny

I did a fresh test and I’ve not reproduced.

Which version of nodejs are you using ?

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 1:25pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/6 "2020-11-25T13:25:51Z")

</div>

node -v:  
v14.15.1

npm -v:  
6.14.8

I deleted everything, redownloaded the code, and then “npm install” in server and front.

I started server:  
npm start

I started front:  
npm run start:development

---

<div class="post-metadata">

**Author:** ![VonOx](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/vonox/32/10128_2.png) [@VonOx](https://community.gladysassistant.com/u/VonOx)\
**Post date:** [November 25, 2020, 1:43pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/7 "2020-11-25T13:43:02Z")

</div>

We are using node 12 for now.

> **[Setup a Mac/Linux development environment | Gladys Assistant](https://gladysassistant.com/docs/dev/setup-development-environment-mac-linux/)**
>
> You'll find here instructions to setup a development environment for Gladys 4.

I will try v14 ASAP

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 25, 2020, 6:20pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/8 "2020-11-25T18:20:45Z")

</div>

It worked fine on my work computer with the following versions:

node -v:  
v12.20.0

npm -v:  
6.14.8

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [November 28, 2020, 5:29pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/9 "2020-11-28T17:29:39Z")

</div>

Interesting thing is on a freshly installed NodeJS 14, I didn’t experience any issues. I think I had mismatch in dependencies or something. I will keep digging 🙂

---

<div class="post-metadata">

**Author:** ![VonOx](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/vonox/32/10128_2.png) [@VonOx](https://community.gladysassistant.com/u/VonOx)\
**Post date:** [November 28, 2020, 6:12pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/10 "2020-11-28T18:12:25Z")

</div>

Ok thank you for feedback

Related Issue [Upgrade to latest version of preact-cli + preact · Issue #982 · GladysAssistant/Gladys · GitHub](https://github.com/GladysAssistant/Gladys/issues/982)

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [December 2, 2020, 8:25pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/11 "2020-12-02T20:25:47Z")

</div>

I can replicated this problem consistently on my main development computer. I was able to adjust “webpack” configuration to resolve “preact-router” module correctly.

---

<div class="post-metadata">

**Author:** ![AlexTrovato](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/alextrovato/32/10705_2.png) [@AlexTrovato](https://community.gladysassistant.com/u/AlexTrovato)\
**Post date:** [December 5, 2020, 6:01pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/12 "2020-12-05T18:01:43Z")

</div>

Hi @siburny,  
did you keep your changes somewhere?  
I try to look for upgrading preact-cli too, but…  
Well it will be nice to see what you did, and maybe continue this way 😉

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [December 5, 2020, 6:36pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/13 "2020-12-05T18:36:02Z")

</div>

Upgrading preact-cli certainly fixed the development startup, but it broke some other parts of Gladys that I am not familiar with yet. Namely, `preact-cli` v3 doesn’t have `preact serve` any more. Based on `package.json` I inferred that it’s needed for serving pages in the “production” mode.

Since the original problem affected only one of my PCs it was easier to track down and fix just this issue.

As for changes, I only had to make one change in `preact.config.js`: I had to remove `preact-cli-plugin-fast-async` plugin completely since it doesn’t support `preact-cli` v3 for now.

---

<div class="post-metadata">

**Author:** ![AlexTrovato](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/alextrovato/32/10705_2.png) [@AlexTrovato](https://community.gladysassistant.com/u/AlexTrovato)\
**Post date:** [December 5, 2020, 6:48pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/14 "2020-12-05T18:48:44Z")

</div>

Thanks, I did it too, but now I have some “errors” on startup:

```auto
ERROR in /home/alex/Gladys/front/node_modules/vis-data/declarations/data-interface.d.ts(1,28):
TS2307: Cannot find module 'vis-util/esnext' or its corresponding type declarations.
ERROR in /home/alex/Gladys/front/node_modules/vis-data/declarations/entry-esnext.d.ts(3,24):
TS2307: Cannot find module 'vis-util/esnext' or its corresponding type declarations.
ERROR in /home/alex/Gladys/front/node_modules/vis-network/declarations/index-legacy.d.ts(13,23):
TS2307: Cannot find module 'vis-util/esnext' or its corresponding type declarations.
ERROR in /home/alex/Gladys/front/node_modules/vis-network/declarations/index-legacy.d.ts(18,25):
TS2497: This module can only be referenced with ECMAScript imports/exports by turning on the 'esModuleInterop' flag and referencing its default export.
ERROR in /home/alex/Gladys/front/node_modules/vis-network/declarations/index-legacy.d.ts(20,27):
TS2307: Cannot find module 'keycharm' or its corresponding type declarations.
ERROR in /home/alex/Gladys/front/node_modules/vis-network/declarations/module/hammer.d.ts(1,20):
TS2307: Cannot find module '@egjs/hammerjs' or its corresponding type declarations.

```

---

<div class="post-metadata">

**Author:** ![siburny](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/siburny/32/6155_2.png) [@siburny](https://community.gladysassistant.com/u/siburny)\
**Post date:** [December 5, 2020, 9:31pm UTC](https://community.gladysassistant.com/t/fresh-development-installation/5785/15 "2020-12-05T21:31:06Z")

</div>

I updated `preact-cli` via `npm install preact-cli@3`. When I start `front` I don’t get errors liked that. I do get a whole bunch of other warnings though. That’s why I decided not to go this route: I have too little knowledge about the whole structure of the project.