Gh61/lovelace-hue-like-light-card

Missing Contributing Guidelines

Opened this issue · 3 comments

paulbuechner commented

Can we please add a CONTRIBUTING.md or SETUP.md guide which explains how to get the project up and running...

For me, I have trouble getting the start cmd to work:

First of all, I had to add the missing dependency lit-html, but now getting the following error:

rollup -c


src/hue-like-light-card.ts → ./dist...
/Users/.../Work/.../lovelace-hue-like-light-card/node_modules/.pnpm/@formatjs+intl-utils@3.8.4/node_modules/@formatjs/intl-utils/lib/src/diff.js (1:16)
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
1: var __assign = (this && this.__assign) || function () {
                   ^
2:     __assign = Object.assign || function(t) {
3:         for (var s, i = 1, n = arguments.length; i < n; i++) {
/Users/.../Work/.../lovelace-hue-like-light-card/node_modules/.pnpm/@formatjs+intl-utils@3.8.4/node_modules/@formatjs/intl-utils/lib/src/diff.js (1:24)
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
404 Not Found

/Users/.../Work/.../lovelace-hue-like-light-card/dist/index.html

(rollup-plugin-serve)
paulbuechner commented

I compiled it without issues using the following cfg modification (using pnpm):

// formatjs is checking 'this' and it throws this warning
if (warning.code === 'THIS_IS_UNDEFINED' &&
    (
        warning.id.includes('@formatjs/intl-utils/lib/src/resolve-locale.js') ||
        warning.id.includes('@formatjs/intl-utils/lib/src/diff.js')
    )
) {
    //console.log(warning);
    return;
}

But still getting the 404 Not Found on http://127.0.0.1:5500

paulbuechner commented

It seems like you can only operate this script from within hs... Correct me if I'm wrong...

So the standard procedure is to copy and replace the compiled script to hs?

Gh61 commented

Hi, it should be as easy as:

  1. git clone ...
  2. npm install
  3. npm start

Then the project is built and served on http://127.0.0.1:5500/hue-like-light-card.js
This URL you can add to your HA instance as a resource (URL: {HA}/config/lovelace/resources)

Ctrl+F5 and you are ready to go. (then you need to Ctrl+F5 every time the script is altered)
The card during development process has different name (type: custom:hue-like-light-card-test - mind the '-test' postfix), so you don't have to remove the classic installed version.

As an alternative you can use some other web serving tool (like this extension to VS Code) and use command npm run fixnbuild for creating new versions of script manually in the /dist folder of the project.
I believe the adress of the script is then something like http://127.0.0.1:5500/dist/hue-like-light-card.js
The fix in the name means automatic fix of linting issues
This is the old method, I've used before rollup-serve plugin.