Skip to content

Latest commit

 

History

History
9 lines (8 loc) · 4.49 KB

2019-12-11.md

File metadata and controls

9 lines (8 loc) · 4.49 KB

2019-12-11

Time Icon Name Message
08:55 shinyu monorepo化のついでに、ビルドスクリプト類の改善要望

vivliostyle.js と vivliostyle-ui がどちらも JavaScript から TypeScript に移行しましたが、ビルドスクリプト類がそれ以前より少し使いにくくなりました。それを改善したいです。

- 以前は、vivliostyle.js をビルドしなくても、vivliostyle-ui 側で npm run build-dev とするだけで開発版の Vivliostyle Viewer ができた。ソースが JavaScript なので、そのままブラウザで動いてデバッグもできた。それが今は、vivliostyle.js と vivliostyle-ui の両方で npm run build-dev が必要。
- 以前は、vivliostyle-ui の npm run serve-devnpm run build-dev と同じビルドを行ってからWebサーバーを起動するものだった。それが今は、 npm run build-dev を行ってから、 npm run serve-dev を行う必要がある。そのうえ、それらの処理内容に重複がある。 production版用の npm run servenpm run build も同様。
- 以前は、vivliostyle-ui の npm run serve-dev でのブラウザでの動作テスト中に、JavaScriptのソースコード(vivliostyle.js でも vivliostyle-ui でも)を修正すると、すぐに動作に反映された。それが今は、vivliostyle.js、vivliostyle-ui 両方の npm run build-dev での再ビルドが必要。

それから、production版であってもデバッグができるように(とくに gh-pages 上の Vivliostyle Viewer がデバッグ実行できてほしい)、vivliostyle.js の source map が、vivliostyle-ui に webpack でまとめられたときに消えてしまっているのを直したいと思っていました。これを使えばよい?: https://github.com/webpack-contrib/source-map-loader
extract sourceMappingURL comments from modules and offer it to webpack
09:01 akabeko 参考になるかわかりませんが、私は npm-scripts を組み合わせるのに npm-run-all を利用しています。

npm-run-all - npm
https://www.npmjs.com/products/pro?utm_source=house&utm_medium=upsellbox&utm_campaign=Proongoingpromo

これを使うと複数の npm-scripts を簡単に組み合わせられ、それらの実行方法も同期、非同期にできます。
シェルのパイプ処理における OS の差も抽象化してくれるので、クロスプラットフォーム対応の面でもオススメです。
npm
09:01 Kiara Translation 🇬🇧: I'm not sure if it helps, but I use npm-run-all to combine npm-scripts.

npm-run-all-npm
https://www.npmjs.com/products/pro?utm_source=house&utm_medium=upsellbox&utm_campaign=Proongoingpromo

Using this, you can easily combine multiple npm-scripts and execute them synchronously or asynchronously.
It also abstracts the OS differences in shell pipe processing, so it is also recommended for cross-platform support.
15:34 U 確かに現状だとビルドステップが煩雑になっているので改善したい箇所です。Monorepo化に伴い親となるルートpackage.jsonが生まれるので、そちらにcoreのwatch&buildとuiのserveを並列起動するnpm-run-allスクリプト(あるいは単に lerna run --parallel)を用意することで、coreの変更をjsにビルドし、それをuiにすぐに反映させるワークフローを作ることができそうです。
15:34 Kiara Translation 🇬🇧: Certainly, the build step is complicated in the current situation, so it is a part that I want to improve. Since the parent package package.json is born with Monorepo conversion, prepare an npm-run-all script (or simply lerna run --parallel) that runs the core watch & amp; build and ui serve in parallel. It seems that we can build a workflow that builds core changes into js and immediately reflects them in ui.