lit-element.polymer-project.org/guide/start - some feedback

[cintaccs]

With the updated Lit-element documentation I tried following the starter guide and downloaded the zip file lit-element-starter-js-master.zip. Unpacked - installed npm using homebrew - open the new folder with Visual Studio Code (Mac latest version). run the npm i command from the terminal I get:

Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)

npm WARN lit-element-starter-js@0.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 (node_modules/browser-sync/node_modules/fsevents):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 install: `node-gyp rebuild`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1

added 1396 packages from 1599 contributors and audited 1472 packages in 17.53s

53 packages are looking for funding
  run `npm fund` for details

found 1003 vulnerabilities (999 low, 4 high)
  run `npm audit fix` to fix them, or `npm audit` for details

The 1000+ vulnerabilities - it that something from the starter project? And if so - can't it be configured to not have these? (the npm audit fix will take care of most of them - but it seems a bit weird for a starter project having these issues).

or is it just my local Mac that have these....? :-)

[cintaccs]

In the "Rename your component" section is mentioned: "npm run build" - however there is no "build" script in the package.json....?

therefore I get:

npm ERR! missing script: build

the README.md file in dev folder of the pure javascript version includes:

This directory contains HTML files containing your element for development. By running `npm run build:watch` and `npm run serve` you can edit and see changes without bundling.

also referring to build:watch - which is not present.

...afterthoughts.... I guess there is no need for a "build" for the pure js version of the "module" type components... however if that is the case - I would suggest the guide to be very very specific about this cool feature - eventually having a separate page for the setting up without all the unnecessary steps and n/a dependencies. Actually everything would be so much more straight forward without typescript, babel and IE11 support...

[cintaccs]

and a typo "fpr".... https://lit-element.polymer-project.org/guide/start - section "Supporting older browsers"

See Build for production fpr more information.

[cintaccs]

Wouldn’t be an idea to have a super keep it simple project for evergreen browsers based on lazy loading module based lit element components - and isn’t that essentially what the dev serve delivers?

I.e. clear simple rollup config for creating the main lit-element for evergreen browsers bundle including some sort of feature to lazy load upon first use all underlying module custom components...?

the bundle could include minified lit-element code. The custom module elements could be without minifying and build steps apart from the beatifier formatter on save type of action...

no Babel, no TypeScript, no polyfills, no webpack - and eventually no roll-up if cdn or copy of cdn served locally is used. That would be a super simple no framework solution with very few dependencies.

[justinfagnani]

Thanks for the feedback. Seems like lit-element-starter-js might just ned some package updates. We might want to move the issue there.

[arthurevans]

Thanks. I've created a PR to fix the Getting Started doc itself. I'll move this issue to the starter project and see if I can address those problems.

[arthurevans]

Hm. I can't seem to transfer the issue to that repo, since it's in a different organization. Guess I'll just open another issue over there.

[cintaccs]

@arthurevans Thanks a lot! I can close the issue - you add whatever is convinient to you! Thanks for fast response and actions :-)

[cintaccs]

@arthurevans on a side-note ... I really like the simplicity of lit-element, the docs etc. I have been using intensively the last year - created a complete BI application with it etc. The thing I still struggle with is the basic setup / bundling / minifying. I am not trying to get into a discussion about whether or not IE support and old Edge is needed - nor whether I think TypeScript is great or not ... however with evergreen browsers supporting module tag - and with the need for TypeScript and roll-up and heavy minifying primarily (at least firstly) related to lit-element "bundle" itself - I think that a very simple startup project that can create the main no-polyfill needing evergreen version of lit-element to be included in the "index.html" main application page - it might be creating the bundle from your typescripted npm distributed package - it might actually just "copy" a distributed bundle js ready to go that you already minified and tested etc. Then the startup project could be js only - no build process needed - dev served instantly with the dev serve option you have already - and the source files = actual dist files without the need for any transpile, webpack or roll-up config for the custom element creation. There could still be karma testing and static doc creation - but the actual components would just be "as is" running under the main bundle version of lit-element, html, css, nothing etc. Maybe I am wrong ... but the fact is that there are way more parts around lit-element and lit-html than necessary and even though some of the bigger frameworks are "bigger" they are potentially delivering a simpler "go to" with everything addressed within the framework. The idea that lit is NOT a framework and a clever small "native" extension should be more obvious IMO. ... just my "2cents" :-) Thanks for your efforts!!