あきき☆エンジニア

〜ぷろぐらむ〜(perl,php,JavaScript,WebGL,golang,emacs,mysql)

chromeでJavaScript編集しファイルへ反映(DevTools Autosave)

WEB JavaScript Ubuntu chrome

DevTools Autosaveは、chromeのデベロッパーツールのSourcesで編集したJavaScriptやCSSを
サーバーへ反映させることができるようになります。

  • インストールするもの
    • chrome→DevTools Autosave
    • サーバー→node.jsで動くautosave


★chromに DevTools Autosave (chromeで以下のページをアクセスして追加する)
chrome.google.com

インストール前↓
f:id:akiki0106:20170317181320p:plain

インストール後↓
f:id:akiki0106:20170317181321p:plain


★サーバーに autosaveをインストール

Ubuntuで最新のnode.jsインストールしてautosaveをインストール

$ sudo apt install nodejs npm
$ sudo npm cache clean
$ sudo npm install n -g
$ sudo n stable
$ sudo apt autoremove nodejs npm
$ sudo npm install -g autosave


★設定する

設定は、chromeのDevTools Autosaveのオプションを編集する
(chrome設定→拡張機能→DevTools AutoSave(オプション))

f:id:akiki0106:20170317181323p:plain


f:id:akiki0106:20170317182027p:plain

Routes→Servers
線を結んだサーバーへ送信される

  • Routes
    • Match (正規表現で編集したいurlを記述)
    • SaveTo サーバー側の保存場所)
  • Servers
    • Nodejs(AutoSave)が動かせているサーバーのurl

例えば、全部ローカルで作業しているなら

Match→http://127.0.0.1/
Save to→/var/www/html/　　(webサーバーのroot path 最後の/を忘れずに)
Servers→http://127.0.0.1:9104


これで設定は、完了～


サーバーで autosaveを立ち上げる

$ autosave 
DevTools Autosave 1.0.0 is running on http://127.0.0.1:9104

chromeでデベロッパーツールのSourcesで編集して CTRL+S でセーブされ
サーバーへ差分が送信されれ保存されれば成功！

サーバー側のautosaveにエラーが出たらpath等が間違っている
可能性がありますので確かめる
何か受け取っているなら何かしらのメッセージが表示されます


ちなみにchrome系ブラウザで SRWare Ironでも試しました～

古いpc(古いグラフィックボード)でcanvasの表示が化ける

WEB chrome


古いＰＣでchrome(バージョンにもよります)のcanvasの描画が化ける(白い豆腐が書き込まれる)
拡大縮小回転(transform)した描画が白い四角として描画される･･･
(transformで回転0℃の描画が白く描画されてしまっているようでした)

以下のurlをchromeで開いて
chrome://flags/#ignore-gpu-blacklist


ソフトウェア レンダリング リストをオーバーライド を有効にすると
gpu未対応機能は、ソフトウェア的に描画してくれるようです。
chromeのバージョンによっては、項目が存在しない場合もあります･･･


設定変更は、自己責任で～

indexedDB(ストレージ)のデバッグ表示

WEB FireFox

FireFoxで開発ツールに初期状態だとストレージ系の表示が無かったので、
表示した手順を書いおきます。


F12で開発ツールを表示↓
f:id:akiki0106:20170310113151p:plain

開発ツールタブ右の方赤○の開発オプションボタンを押す
f:id:akiki0106:20170310113156p:plain

標準の開発ツールの項目でストレージにチェックを入れます
f:id:akiki0106:20170310113200p:plain

開発ツールタブにストレージが追加された
f:id:akiki0106:20170310113202p:plain



IndexedDBの使い方は、後日別記事に（いつになるのか）

Ubuntuインストール後の環境設定順（私の･･･)

UNIX Ubuntu VMware

Ubuntuインストール後の真っ新状態･･･何からどうするか戸惑いますｗ

何をするか箇条書きしておこうと♪


今のところ以上
(時間を計ってみたUbuntuのアップデートもして35分でemacsが使える状態になりました)

VMwareの仮想マシン上でマウスの戻るボタンを使えるようにする（ブラウザー、etc.)

VMware

 

仮想マシンのファイルが入っているフォルダーの HOGE.vmx ファイルに

以下を追加するとブラウザ等でマウスの戻るボタンが使えるようになります。

 注意(仮想マシンが動いてない状態で編集すること・・・

　　　仮想マシンが動いていると終了したときに前の状態に書き戻される?）

 

usb.generic.allowHID = "TRUE"
mouse.vusb.enable = "TRUE"
mouse.vusb.useBasicMouse = "FALSE"

 

HIDとは、ヒューマン インターフェイス デバイス の略でマウスとキーボードがHIDに当たる。

 

perl文字コード指定(utf-8)

perl

perlでutf8 の文字コードを使う

 

use utf8;
use open IO => ':utf8';
binmode(STDERR,":encoding(utf8)");
binmode(STDOUT,":encoding(utf8)");

print "漢字";

 

私の設定なのでこれが最善なのか・・・?

 

設定しないでutf8等の日本語を表示(print)すると

Wide character in print at xxx.pl ...

と出ます。

 

 

 

dos窓(コマンドプロンプト)の文字コード指定

Windows dos

 

プログラムでutf8を使うのがデフォルトになったがwindowsのコマンドプロンプトで文字化けしてしまう…。

utf-8を表示できるようにするには、コマンドプロンプト上で以下のコマンドを実行する。

バッチ(bat)に書いて実行するのもいいでしょう、ただしバッチファイルの先頭に書いた方がいい感じです。

 

c:\> chcp 65001

 

shift jis に戻すには

c:\>chcp 932