Merge pull request #193 from Polymer/3.0

3.0

.gitignore

@@ -1,2 +1,2 @@
-bower_components
+node_modules
 build

README.md

@@ -1,77 +1,38 @@
 # SHOP
 
-## Prerequisites
+Shop is a sample e-commerce [Progressive Web App](https://developers.google.com/web/progressive-web-apps/).
 
-### Polymer CLI
+![shop screenshot](https://user-images.githubusercontent.com/116360/39545341-c50a9184-4e05-11e8-88e0-0e1f3fa4834b.png)
 
-Install [polymer-cli](https://github.com/Polymer/polymer-cli):
+## Features/highlights
 
-    npm install -g polymer-cli
+- a sample e-commerce shopping site
+- pattern for a real-life shopping cart and store checkout flow
+- pattern for using custom announcers for accessibility
 
-### Setup
-
-    # Using CLI
-    mkdir shop
-    cd shop
-    polymer init shop
-
-    # Or cloning direct from GitHub
-    git clone https://github.com/Polymer/shop.git
-    cd shop
-    bower install
-
-## Start the development server
-
-    polymer serve
-
-## Run web-component-tester tests
-
-    polymer test
+## Setup
+```bash
+$ git clone https://github.com/Polymer/shop.git
+$ cd shop
+$ npm i
+$ npm start
+```
 
 ## Build
-
-Build presets provide an easy way to define common build configurations in your `polymer.json` file. There are 3 build presets we put in `polymer.json` file in Shop:
-
-**es5-bundled**
-
-- js: {minify: true, compile: true}
-- css: {minify: true}
-- html: {minify: true}
-- bundle: true
-- addServiceWorker: true
-- addPushManifest: true
-- insertPrefetchLinks: true
-
-**es6-unbundled**
-
-- js: {minify: true, compile: false}
-- css: {minify: true}
-- html: {minify: true}
-- bundle: false
-- addServiceWorker: true
-- addPushManifest: true
-- insertPrefetchLinks: true
-
-**es6-bundled**
-
-- js: {minify: true, compile: false}
-- css: {minify: true}
-- html: {minify: true}
-- bundle: true
-- addServiceWorker: true
-- addPushManifest: true
-- insertPrefetchLinks: true
-
-Run the command to build the presets:
-
-    polymer build
+```bash
+$ npm run build
+```
 
 ## Test the build
-
-Use `polymer serve` to serve a specific build preset of the app. For example:
-
-    polymer serve build/es5-bundled
+To test prpl-server build:
+```bash
+$ npm run serve:prpl-server
+```
+To test static build:
+```bash
+$ npm run serve:static
+```
 
 ## Deploying
 
-Our [production deployment of SHOP](https://shop.polymer-project.org/) is hosted on App Engine with Node.js. You can examine its configuration on the [app-engine-node branch](https://github.com/Polymer/shop/tree/app-engine-node) of this repository and [compare it with the master branch](https://github.com/Polymer/shop/pull/145).
+Our [production deployment of SHOP](https://shop.polymer-project.org/) is hosted on App Engine with Node.js. It can be deployed with [the same steps as PWA Starter Kit](https://polymer.github.io/pwa-starter-kit/building-and-deploying/#deploying-prpl-server).

gulpfile.js

@@ -0,0 +1,43 @@
+/**
+@license
+Copyright (c) 2018 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+
+const gulp = require('gulp');
+const rename = require('gulp-rename');
+const replace = require('gulp-replace');
+const del = require('del');
+
+/**
+ * Cleans the prpl-server build in the server directory.
+ */
+gulp.task('prpl-server:clean', () => {
+  return del('server/build');
+});
+
+/**
+ * Copies the prpl-server build to the server directory while renaming the
+ * node_modules directory so services like App Engine will upload it.
+ */
+gulp.task('prpl-server:build', () => {
+  const pattern = 'node_modules';
+  const replacement = 'node_assets';
+
+  return gulp.src('build/**')
+    .pipe(rename(((path) => {
+      path.basename = path.basename.replace(pattern, replacement);
+      path.dirname = path.dirname.replace(pattern, replacement);
+    })))
+    .pipe(replace(pattern, replacement))
+    .pipe(gulp.dest('server/build'));
+});
+
+gulp.task('prpl-server', gulp.series(
+  'prpl-server:clean',
+  'prpl-server:build'
+));

index.html

@@ -57,8 +57,8 @@
 
   <shop-app unresolved>SHOP</shop-app>
 
-  <script src="bower_components/webcomponentsjs/webcomponents-loader.js"></script>
-  <link rel="import" href="src/shop-app.html">
+  <script src="node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
+  <script type="module" src="src/shop-app.js"></script>
 
   <script>
     window.performance && performance.mark && performance.mark('index.html');