WindowsへのElectron導入する前後でハマったところを解決してみた その1
はじめに
Electronというものをつい数か月前に知りました。皆さんも知ってますか?
簡単に言うとWindowsでデスクトップ用のソフトウェアを作れる環境みたいなものです。
Windowsで使われているソフトウェアは、C#などの.net系やC言語、Delphiあたりで作られてることが多いです。
それ以外はブラウザを介してWebサービスでソフトウェアのように使っていると思います。
Gmailとかがそれですね。
ElectronはWeb技術であるHTML、CSS、JS系などの組み合わせでデスクトップ用のソフトウェアを作れちゃうんです。
しかもWindows、Mac、Linuxなどのプラットフォームを問わずに実装できる夢のような環境ですね。
サーバ上でしか、身動きできなかったWeb技術がサーバいらずでどこでも実装できるのであれば、
いよいよHTMLが世界を支配しそうですね。
Electronの動作の実態は、
HTML、CSS、JS系のソースをchromium(オープンソース版のChrome)で動かす
というシンプルな構成と思えばいいですね。
準備物
・Atom
HTMLを書くのに便利なエディタ。
出た当初は重すぎて使えず、Sublime Textを使っていたが、最近は十分実用的になった。
導入
インストール手順は、ここを参考にしています。
導入してハマったところ
- nodeのプロキシ設定
- Windows環境でのsqlite3導入
プロキシ設定
Electronを導入するコマンドはnodejs導入後に
npm -g install electron-prebuilt
で導入できるが、プロキシ環境ではデフォルト設定では動作しない。
会社で導入する場合はプロキシサーバなどで通常のネット通信以外の通信が遮断されている可能性が高いため、突破する必要がある。
※プロキシサーバを突破して接続していいかは、会社でちゃんと調整してね。
プロキシサーバが書かれているの場所
Internet Explorerを開いて、インターネットのプロパティを開き、 「接続」タブ→「LANの設定」をクリックすればプロキシサーバのアドレスとポートが書かれているので、メモをする。
コマンドプロンプトを開き、以下のコマンドを入力する。
※プロキシサーバのアドレスは
netsh winhttp import proxy source=ie npm config set proxy "http://<server>:<port>/" npm config set https-proxy "http://<server>:<port>/"
上記のコマンドは
1つ目は、Windows自体の設定を変更するコマンドで、Internet Explorerのプロキシ設定を使用するようにするための設定、
2つ目と3つ目は、node.jsのnpmコマンドの設定でプロキシサーバを介してネットワークの外に出るための設定を指します。
それでもつながらなかった場合は以下のコマンドも実行すればいいらしいが、上記の設定で基本、接続できます。
npm config set registry "http://registry.npmjs.org/"
私がハマったところというのは、
npm config set proxy "http://<server>:<port>/"
の箇所を
npm -g config set proxy "http://<server>:<port>/"
としてしまいました。
これがいけなかった。。。orz
-gというglobalに設定するオプションをつけたため、
プロキシサーバの設定は一見できており、
npm -g install asar
を導入できました。
が、Electron導入の
npm -g install electron-prebuilt
がどうしてもインストールできなった。
理由は一部のシステムがglobalの設定を読まなかったせいでした。
-gをつけずにユーザ設定として設定すればすべてがうまくいきました。
本件については以下の記事が参考になります。
npm config -g でプロキシの設定をしているのに electron-quick-start や electron-prebuilt でコケる | Aqua Ware つぶやきブログ
この-gの問題は一時的なものかもしれませんが、 同様にハマっている人がいれば、役に立てるかと思います。
sqlite3導入
sqlite3については長くなりそうなので、また次回!!!