Tweet
Tweet

Slide 1

Slide 1 text

Vue CLI 〜 Library Build でハマった話 〜

Slide 2

Slide 2 text

https://twitter.com/KangShindeok https://github.com/heavymery ラクスル株式会社 姜 信徳 / Shindeok Kang 自己紹介 フロントエンド開発 エンジニアリング・マネージャー

Slide 3

Slide 3 text

Index ● ラクスルのサービスと技術スタック ● npm package 化したい背景 ● そこでハマった！

Slide 4

Slide 4 text

ラクスルのサービスと技術スタック TVCM

Slide 5

Slide 5 text

ラクスルのサービスと技術スタック Server Side Frontend

Slide 6

Slide 6 text

npm package 化したい背景 Super Cool Web App Super Cool SPA Super Cool Web App Super Cool SPA Super Cool Web App Super Cool SPA ... Same Codes ... Same ? Code ...

Slide 7

Slide 7 text

npm package 化したい背景 ● Common UI Components ● Common Store modules ● Utilities ... Super Cool Package Super Cool Web App Super Cool SPA

Slide 8

Slide 8 text

そこで ● ググったら公式サイトのページ Cookbook が出てきた https://vuejs.org/v2/cookbook/index.html ● Cookbook の rollup 設定が良く分からなかった https://vuejs.org/v2/cookbook/packaging-sfc-for-npm.html ● Vue CLI の Library Build 機能があるっぽい！ https://cli.vuejs.org/guide/build-targets.html#library

Slide 9

Slide 9 text

だけど ● Vue CLI ドキュメントの設定方法が良く分からない ● ググってみると Component の簡単な例は見つかった ● Store モジュールとかも package 化したいし ● TypeScript で書きたいし ● ...

Slide 10

Slide 10 text

そこでハマった！

Slide 11

Slide 11 text

DEMO my-lib と my-app でハマるデモ

Slide 12

Slide 12 text

THANK YOU 良い方法あったら教えてください

Slide 13

Slide 13 text

THANK YOU 良い方法見つかったらブログ書きます ✌ https://tech.raksul.com/