Polymer: How to build 2.0?

Created on 25 Apr 2017  路  4Comments  路  Source: Polymer/polymer

Description

Building master branch seems impossible.

Steps to Reproduce

git clone https://github.com/Polymer/polymer.git
cd polymer
npm install
bower install
npm run build

Expected Results

No errors

Actual Results

> @polymer/[email protected] build /media/Data/polymer
> gulp

[13:58:14] Using gulpfile /media/Data/polymer/gulpfile.js
[13:58:14] Starting 'build-bundled'...
[13:58:14] Starting 'build-steps'...
[13:58:14] 'build-steps' errored after 129 渭s
[13:58:14] Error: Task print-size is not configured as a task on gulp.  If this is a submodule, you may need to use require('run-sequence').use(gulp).
    at /media/Data/polymer/node_modules/run-sequence/index.js:20:10
    at Array.forEach (native)
    at verifyTaskSets (/media/Data/polymer/node_modules/run-sequence/index.js:13:11)
    at runSequence (/media/Data/polymer/node_modules/run-sequence/index.js:92:2)
    at Gulp.<anonymous> (/media/Data/polymer/gulpfile.js:262:3)
    at module.exports (/media/Data/polymer/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/media/Data/polymer/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/media/Data/polymer/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/media/Data/polymer/node_modules/orchestrator/index.js:134:8)
    at runNextSet (/media/Data/polymer/node_modules/run-sequence/index.js:86:16)
[13:58:14] 'build-bundled' errored after 2.13 ms
[13:58:14] Error in plugin 'run-sequence(build-steps)'
Message:
    Task print-size is not configured as a task on gulp.  If this is a submodule, you may need to use require('run-sequence').use(gulp).
Stack:
Error: Task print-size is not configured as a task on gulp.  If this is a submodule, you may need to use require('run-sequence').use(gulp).
    at /media/Data/polymer/node_modules/run-sequence/index.js:20:10
    at Array.forEach (native)
    at verifyTaskSets (/media/Data/polymer/node_modules/run-sequence/index.js:13:11)
    at runSequence (/media/Data/polymer/node_modules/run-sequence/index.js:92:2)
    at Gulp.<anonymous> (/media/Data/polymer/gulpfile.js:262:3)
    at module.exports (/media/Data/polymer/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/media/Data/polymer/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/media/Data/polymer/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/media/Data/polymer/node_modules/orchestrator/index.js:134:8)
    at runNextSet (/media/Data/polymer/node_modules/run-sequence/index.js:86:16)

npm ERR! Linux 4.10.0-20-generic
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "build"
npm ERR! node v7.9.0
npm ERR! npm  v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @polymer/[email protected] build: `gulp`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @polymer/[email protected] build script 'gulp'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the @polymer/polymer package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     gulp
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs @polymer/polymer
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls @polymer/polymer
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /home/nazar-pc/.npm/_logs/2017-04-25T10_58_14_261Z-debug.log

Versions

nodejs --version
v7.9.0
npm --version
4.2.0
bower --version
1.8.0
gulp --version                                                  
[14:15:43] CLI version 3.9.1
[14:15:43] Local version 3.9.1
2.x p1

Most helpful comment

Thanks for the issue. Agreed we need to get the gulpfile cleaned up. The gulp tasks there were mainly for spot-checking the size of a minified polymer as well as testing closure compiler build/linting, but got into a state of disrepair since we don't actually use them on a regular basis.


Probably more than you were asking for, but here's background on our release/distribution plans:

The plan for the initial Polymer 2.0 release is actually to distribute the core library as raw ES6 source (unbundled/untranspiled/unminified, hence the gulpfile isn't really in the release workflow), and allow users to perform those tasks at the deployment step as their conditions dictate, e.g. using Polymer CLI.

There are a few different reasons for this approach:

  • We want the constituent bits of Polymer 2.0 (which is built out of composable mixins) to be consumable alacarte without the payload cost of the entire bundled library (e.g., using only lib/mixins/property-accessors.html or template-stamp.html alacarte gives you a lot of power for just a few kb)
  • Native custom elements require native ES6 classes, so there are performance benefits to keeping the source as untranspiled ES6 and serve ES5-transpiled source only to browsers that need it (requires a more complex server setup, but we want to allow for that, although we also have the native shim to allow ES5 source be served from a dumb server and still run on native CE with a modest performance hit)
  • It's more consistent with how elements are delivered

We're also very interested in plugging into the "module ecosystem" as well, so we may very well end up shipping Polymer in a more traditional format (and adapt the gulpfile for build output suitable to that), but haven't quite landed on the final shape of that yet. In the meantime though, as you pointed out, we need to fix the gulpfile to not explode.

All 4 comments

Thanks for the issue. Agreed we need to get the gulpfile cleaned up. The gulp tasks there were mainly for spot-checking the size of a minified polymer as well as testing closure compiler build/linting, but got into a state of disrepair since we don't actually use them on a regular basis.


Probably more than you were asking for, but here's background on our release/distribution plans:

The plan for the initial Polymer 2.0 release is actually to distribute the core library as raw ES6 source (unbundled/untranspiled/unminified, hence the gulpfile isn't really in the release workflow), and allow users to perform those tasks at the deployment step as their conditions dictate, e.g. using Polymer CLI.

There are a few different reasons for this approach:

  • We want the constituent bits of Polymer 2.0 (which is built out of composable mixins) to be consumable alacarte without the payload cost of the entire bundled library (e.g., using only lib/mixins/property-accessors.html or template-stamp.html alacarte gives you a lot of power for just a few kb)
  • Native custom elements require native ES6 classes, so there are performance benefits to keeping the source as untranspiled ES6 and serve ES5-transpiled source only to browsers that need it (requires a more complex server setup, but we want to allow for that, although we also have the native shim to allow ES5 source be served from a dumb server and still run on native CE with a modest performance hit)
  • It's more consistent with how elements are delivered

We're also very interested in plugging into the "module ecosystem" as well, so we may very well end up shipping Polymer in a more traditional format (and adapt the gulpfile for build output suitable to that), but haven't quite landed on the final shape of that yet. In the meantime though, as you pointed out, we need to fix the gulpfile to not explode.

Thanks a lot for those details, makes sense!

Just as a side note, will all of following: Chromium, Firefox, Edge and Safari, support all ES2015 features necessary for Polymer in 2 latest releases as of today (I'd like to eliminate transpiling process entirely)?

@nazar-pc Correct, no transpilation needed for latest release of all 4 major browsers. If you choose to use the CLI polymer serve UA sniffs and will transpile on the fly for testing in IE (and older versions of the other browsers) to make it even easier.

polymer build has support for doing a universal ES5 build as well as separate ES5 and ES6 builds for deployment.

One note that Edge 14 does have some bugs in their ES6 impl (a particularly bad one where constructing an ES6 class too many times blows up) and so we recommend transpiling Edge and do so by default in the CLI tools (although I believe Edge 15 has resolved this).

Closing, as gulpfile was cleaned up in https://github.com/Polymer/polymer/pull/4565.

The following gulp tasks are implemented (and default task removed):

  • clean - removes dist dir
  • estimate-size - estimates the size of minified polymer.html bundle
  • lint - runs eslint
  • lint-closure - runs closure compiler and outputs logfile with closure warnings (closure typing of the entire library is WIP)
  • closure - runs closure compiler "advanced compilation" mode and outputs build of polymer.html (not particularly useful for end-users due to dead-code elimination, but useful for testing compilability)
Was this page helpful?
0 / 5 - 0 ratings