Upgrade to Pro — share decks privately, control downloads, hide ads and more …

導入事例から学ぶ Polymer開発 / Polymer-Japan-2017-11-04-2

導入事例から学ぶ Polymer開発 / Polymer-Japan-2017-11-04-2

Kenichiro Kishida

November 04, 2017
Tweet

More Decks by Kenichiro Kishida

Other Decks in Technology

Transcript

  1. w W w WW w WW w W w W

    w W w W w W w W https://github.com/Polymer/polymer/releases 89 Releases!!
  2. /1.4DSJQUT “start”: “polymer serve -H 0.0.0.0 & gulp canned”, “lint”:

    “gulp lint”, “lint:ci”: “gulp lint —ci”, “test” : “gulp test”, “test:ci”: “gulp test —ci”, “postinstall”: “bower install”, “deploy:xxx”: “gulp deploy —target=xxx”
  3. 5FTUJOH const wct = require('web-component-tester').test; const options = { plugins:

    { local: ['chrome', 'firefox'], } }; wct(options).then(() => { console.log('テスト成功'); }).catch((error) => { console.log(error); });
  4. -JOU gulp.task('lint', () => { return gulp.src(['src/**/*.html', '!src/app.html']) .pipe(polylint({noRecursion: true}))

    .pipe(jshint.extract('auto')) .pipe(jshint({expr: true})) .pipe(polylint.combineWithJshintResults()) .pipe(jshint.reporter, 'jshint-stylish') .pipe(jshint.reporter, 'fail'); });
  5. #VJME const htmlminOptions = { collapseWhitespace: true, minifyCSS: true, minifyJS:

    true, removeComments: true }; gulp.task('deploy.minify', () => { return gulp.src(dist('/src/**/*.html')) .pipe(htmlmin(htmlminOptions)) .pipe(gulp.dest(dist('/src'))); });
  6. (FOFSBUF4FSWJDF8PSLFS const PolymerProject = require('polymer-build').PolymerProject; const addServiceWorker = require('polymer-build').addServiceWorker; const

    mergeStream = require('merge-stream'); const swPrecacheConfig = require(path.join(__dirname, '..', '..', 'sw-precache-config.js')); const project = new PolymerProject(require(path.join(__dirname, '..', '..', 'polymer.json'))); gulp.task('deploy.addServiceWorker', ['deploy.stream'], () => { return addServiceWorker({ buildRoot: dist(), project: project, swPrecacheConfig: swPrecacheConfig, }); }); gulp.task('deploy.stream', () => { return mergeStream(project.sources(), project.dependencies()); });
  7. %FQMPZ const awspublish = require('gulp-awspublish'); const parallelize = require("concurrent-transform"); const

    cloudfront = require('gulp-cloudfront-invalidate-aws-publish'); gulp.task('deploy.invalidate', () => { const publisher = createPublisher(); return gulp.src(dist('**/*')) .pipe(parallelize(publisher.publish(headers), 10)) .pipe(publisher.sync()) .pipe(cloudfront(cfSettings)) .pipe(publisher.cache()) .pipe(awspublish.reporter()); });