Improve JS bundling (#281)

- Only import modules on the pages they are actually needed. Previously we had a global.js that had way more than was needed on most pages.
- Choose some nicer names for the common Rollup chunks. Now we'll have a "lit.js" chunk that's just lit. I expect people will look for this in devtools, and it's nice to have it be there and be the minimal size.
- Re-organize TypeScript files.
- Unified/much simpler rollup config.
- Don't use module + async, it's more aggressive.
- Change rollup output to rollupout/ instead of writing directly into _site -- this interferes with the dev cycle less.

Also:

- Fix API docs import styling
- Switch to new Google SPDX license headers

Author: aomarks

.gitignore

@@ -10,8 +10,8 @@ packages/*/index.d.ts.map
 
 packages/lit-dev-content/_site
 packages/lit-dev-content/_dev
-packages/lit-dev-content/site/_includes/js/
 packages/lit-dev-content/playground-plugin
+packages/lit-dev-content/rollupout
 
 packages/lit-dev-api/lit/
 packages/lit-dev-api/api-data/**/*

LICENSE

@@ -0,0 +1,28 @@
+BSD 3-Clause License
+
+Copyright (c) 2020 Google LLC. All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package-lock.json

@@ -17,7 +17,7 @@
     "check-links:internal": "wait-on tcp:8080 && blc http://localhost:8080 --exclude '*TODO_HREF' --exclude 'http://localhost:8080/api/*' --recursive --exclude-external --ordered",
     "check-links:external": "wait-on tcp:8080 && blc http://localhost:8080 --exclude '*TODO_HREF' --exclude 'http://localhost:8080/api/*' --exclude 'http://localhost:8000/dev/' --exclude 'https://github.com/Polymer/internal*' --exclude 'https://github.com/PolymerLabs/lit.dev*' --exclude 'https://www.npmjs.com/*' --get --recursive --exclude-internal --host-requests 1"
   },
-  "author": "",
+  "author": "Google LLC",
   "license": "BSD-3-Clause",
   "devDependencies": {
     "broken-link-checker": "^0.7.8",

package.json

@@ -40,23 +40,24 @@ module.exports = function (eleventyConfig) {
   eleventyConfig.addPlugin(playgroundPlugin);
   if (!DEV) {
     // In dev mode, we symlink these directly to source.
+    eleventyConfig.addPassthroughCopy({'rollupout/': './js/'});
     eleventyConfig.addPassthroughCopy('site/css');
     eleventyConfig.addPassthroughCopy('site/images');
     eleventyConfig.addPassthroughCopy('samples');
+    eleventyConfig.addPassthroughCopy({
+      'node_modules/playground-elements/playground-typescript-worker.js':
+        './js/playground-typescript-worker.js',
+    });
+    eleventyConfig.addPassthroughCopy({
+      'node_modules/playground-elements/playground-service-worker.js':
+        './js/playground-service-worker.js',
+    });
+    eleventyConfig.addPassthroughCopy({
+      'node_modules/playground-elements/playground-service-worker-proxy.html':
+        './js/playground-service-worker-proxy.html',
+    });
   }
   eleventyConfig.addPassthroughCopy('api/**/*');
-  eleventyConfig.addPassthroughCopy({
-    'node_modules/playground-elements/playground-typescript-worker.js':
-      './js/playground-typescript-worker.js',
-  });
-  eleventyConfig.addPassthroughCopy({
-    'node_modules/playground-elements/playground-service-worker.js':
-      './js/playground-service-worker.js',
-  });
-  eleventyConfig.addPassthroughCopy({
-    'node_modules/playground-elements/playground-service-worker-proxy.html':
-      './js/playground-service-worker-proxy.html',
-  });
 
   eleventyConfig.addWatchTarget('../lit-dev-api/api-data');
 
@@ -236,16 +237,16 @@ ${content}
 
   /**
    * Inline the Rollup-bundled version of a JavaScript module. Path is relative
-   * to ./site/_includes/js/ directory (which is where Rollup output goes).
+   * to ./rollupout.
    *
-   * In dev mode, instead directly import the module relative from ./lib/ (which
-   * is where TypeScript output goes).
+   * In dev mode, instead directly import the module, which has already been
+   * symlinked directly to the TypeScript output directory.
    */
   eleventyConfig.addShortcode('inlinejs', (path) => {
     if (DEV) {
-      return `<script type="module" src="/lib/${path}"></script>`;
+      return `<script type="module" src="/js/${path}"></script>`;
     }
-    const script = fsSync.readFileSync(`site/_includes/js/${path}`, 'utf8');
+    const script = fsSync.readFileSync(`rollupout/${path}`, 'utf8');
     return `<script type="module">${script}</script>`;
   });
 
@@ -301,11 +302,11 @@ ${content}
         path.join(__dirname, '_dev', 'samples')
       );
 
-      // Symlink lib -> _dev/lib. This lets us directly reference tsc outputs in
+      // Symlink lib -> _dev/js. This lets us directly reference tsc outputs in
       // dev mode, instead of the Rollup bundles we use for production.
       await symlinkForce(
         path.join(__dirname, 'lib'),
-        path.join(__dirname, '_dev', 'lib')
+        path.join(__dirname, '_dev', 'js')
       );
     } else {
       // Inline all Playground project files directly into their manifests, to