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

Webpacker の webpack.config.js を見る…つもりだった話/Toyam...

muryoimpl
December 08, 2018

Webpacker の webpack.config.js を見る…つもりだった話/Toyamarb#35LightningTalk_WebpackerConfigShower

Toyama.rb#35 年末LT大会 でしたLTスライド。
Webpacker 内部にある webpack.config.js を出力したかったが、見え過ぎちゃって困った話。

muryoimpl

December 08, 2018
Tweet

More Decks by muryoimpl

Other Decks in Technology

Transcript

  1. 名前: 無量井 健( むりょうい けん) @kunitoo の同僚で、金沢でフルリモート勤務中 Toyama.rb は 2

    回目の参加 です 最近は *.rb というより、*.js を書くことが多い 自己紹介 自己紹介
  2. Ruby on Rails に組み込める gem sprockets と連携しつつ、webpack を使うことができる Rails とともにモダンな

    JavaScript libraries/framework を使 って開発ができるようになる Webpacker とは Webpacker とは
  3. Ruby on Rails が提供してくれているいい感じのデフォルト値 がどんなものなのかわかりにくい 内部で npm package を経由しているので Ruby

    だけ見てもわ からない プログラマブルな書かれ方をしているので、脳内で組み立てな いと全体がわかりにくい Webpacker の気になるところ Webpacker の気になるところ
  4. $ bin/rails webpacker:config:show { "output": { ... "publicPath": "/packs/", "pathinfo":

    true }, "resolve": { "extensions": [ ... ] }, ... "entry": { ... }, ... "plugins": [ { "keys": [ "GREP_COLOR", "CLOUDSDK_PYTHON", "ZPLUG_CACHE_DIR", ... "BUNDLER_ORIG_BUNDLE_BIN_PATH", "BUNDLER_ORIG_RB_USER_INSTALL",
  5. webpack の plugin 部分などのオブジェクトが記載されている 箇所が 展開されて 表示されてしまう… 設定がclass として表現されているから?そのまま表示は厳し い?

    これはおとなしくwebpacker のpackage/environments を 見るしかないのか… おわかりだろうか… おわかりだろうか…
  6. https://github.com/muryoimpl/webpacker_config_shower rails plugin new webpacker_config_shower railtie を Rails::Engine を継承したものに変更(Rake ファイル

    ロードのため) webapcker で内部コマンドを実行する Runner を継承して node コマンドを実行する Gem としてやったこと Gem としてやったこと
  7. require 'webpacker' require 'webpacker/runner' require 'open3' module WebpackerConfigShower class Runner

    < ::Webpacker::Runner def self.run(argv) ENV["NODE_ENV"] ||= Rails.env super end def run cmd = [ "node", "-e", *[ "const conf = require('#{@webpack_config}')", "const { format } = require('util')", "console.log(format('%j', conf))", ].join(';') ] Dir.chdir(@app_path) do _, stdout, _ = *Open3.popen3(*cmd) puts JSON.pretty_generate(JSON.parse(stdout.read)) end end