Gh61 / lovelace-hue-like-light-card

This card provides a Hue-like way to control your lights in Home Assistant.
GNU Lesser General Public License v2.1
153 stars 12 forks source link

Missing Contributing Guidelines #166

Open paulbuechner opened 8 months ago

paulbuechner commented 8 months ago

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 8 months ago

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 8 months ago

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 8 months ago

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.