JavaScript node.js

Gulp+WebpackでElectronのライブリロード

投稿日:

electron-connect

前につくった環境をアップデートしたら大変だったのでメモ

package.json

結果、開発環境で使ったライブラリ.

.babelrc

babelはバージョン7から、@babel/coreをつかう.
babel-loaderのバージョン8は、babelのバージョン7以上が必要なので、@babel/coreのほうを使わなければならない.
で、presetのほうもそれに対応したものをつかう.

webpack.config.coffee

前はbrowseryを使っていたのをwebpackに変えた.

gulpfile.coffee

gulpはバージョン4がこの春にでたぽい.今はgulp@nextをつけなくても、バージョン4がインストールされる.
gulp4では、gulp.taskは単なる関数をexportsする方法でもよくなった.
exportsすると、gulp indexとかで指定のタスクを実行できる.
gulp-watchの第2引数の方は、単なる関数の方を実行している.
exports先の方のタスクはなぜか実行できなかった.

Electronでは、mainプロセスのほうとrendererプロセスのほうの開発に分けられるけど、
mainプロセスのほうはnode.jsなのでたぶんbabelでトランスコンパイルしなくてもes2016のままでいける.
rendererプロセスのほうはchromeをつかってるので、基本babelでトランスコンパイルする.
そのほかcssや画像などのパッキングも含めて、rendererプロセスのほうはwebpackにまかせる.
mainプロセスのほうは、gulpでcoffeescript2をコンパイルして、移動させる.

webpack-streamはエラーが出ても、gulpが止まらないように設定する.

React.jsがつかえるか試してみる

React Treebeardというコンポーネントを試してみた.ほぼREADMEのまま.

-JavaScript, node.js
-, , , ,

執筆者:

関連記事

デスクトップアプリを作成できるフレームワークをWindowsで触ってみた~Electron

By: Adam Jenkins – CC BY 2.0 目次1 Electron2 前提3 electronのインストール4 Hello World5 パッケージング6 DevTool7 …

no image

位置情報通知の使いみちアイデアメモ

    ここまでHTML5とGoogle Mapsを使った位置情報通知を試してきたけど、その使いみちについてメモしておきたい 目次1 カレログ的なサービス2 宝探し的なイベント3 …

Electron + CoffeeScript + Backbone.js + EcoでTodolistをつくってみた

By: Purple Slog – CC BY 2.0 目次1 はじめに2 gulpの準備3 Hello electron4 Hello Backbone.js & eco5 Ba …

Ubuntu12.04にnode6.9をインストール~nodebrew

By: Kazuyoshi Kato – CC BY 2.0 目次1 nodebrew自身のアップデート2 nodebrewでnode6.9をインストール3 yarnのインストール nod …

Rails4でつかえるインラインエディタを試してみた〜X-editable-rails

目次1 x-editable2 bootstrapを導入3 x-editable-rails4 サンプルアプリ x-editable 文字をダブルクリックして編集できるやつ x-editable vi …