FC2ブログ
import / export の使い方メモ Javascript ES6
※ "main.js?v20190615" のようにタイムスタンプを追加すると、main.js だけでなく、main.js に import されるクラスやモジュールも最新版が読み込まれるようです

こんな構成
./
test.html
main.js
MyClass.js


(test.html) ... 読み込み元の html ファイル



(main.js) ... import する側
import {MyClass} from './MyClass.js'
var mc = new MyClass()
console.log (mc.myMethod())


(MyClass.js) ... export される側
export class MyClass {
constructor() {
this._val = "This is MyClass"
}
myMethod () {
return this._val
}
}




スポンサーサイト
2019-06-15 Sat | JavaScript | トラックバック:0 | コメント:0
Windows10 に Apache24 をインストール
Javascript (ES6) で import / export を使おうとすると、ブラウザが CRONエラー を吐いてしまい、動作しない。

ローカルファイル同士だとドメイン情報が無く(?)ため、クロスドメイン扱いとなり、このCRONエラーになるらしい。

Google Chrome だったら --disable-web-security --user-data-dir のコマンドラインオプション付けて起動すれば良いみたいだけど、私が使ってる vivaldi だとそんなオプションは当然ない。

仕方ない。サーバー立てるか。
mySQLとかも練習できるし良いかもしれない。

というわけで、やむをえず Windows10 に Apache24 をインストールすることにしたので、その手順を自分メモ。

(Apacheを入手)
ApacheのサイトからzipをDL
zipを解凍
中にある apache24 フォルダを cドライブ直下へ移動 (c:\apache24 となる)

(WWWサービスの起動オプション変更)
Win+Rキー で services.msc を起動
「World Wide Web 発行サービス」の起動オプションを「手動」に変更
同じサービスをいったん「停止」する

(Apache をインストール)
管理者権限でcmdを起動
cd c:\apache24\bin
httpd.exe -k install
エラー表示がなければインストール完了

(Apache を起動)
c:\apache24\bin\httpd.exe をDクリックもしくはcmdから起動
Windowsファイアウォールで「セキュリティの重要な警告」画面が出るので「アクセスを許可する」

(ブラウザで確認)
http://localhost/ にアクセス。
「It works!」と表示されれば起動成功。

(HTMLドキュメントのルートはここにした)
c:\apache24\conf\httpd.conf ファイル251行目に以下の記述がある
DocumentRoot "${SRVROOT}/htdocs"


※ ちなみにシンボリックリンクやエイリアスも置けるらしい。

Dドライブにユーザーディレクトリを置いているので、D:\users\username\htdocs フォルダを作って、
DocumentRoot "D:\users\username\htdocs"

へ変更して保存

test.html を適当に作って↑の htdocs フォルダに保存

apache を再起動し、
ブラウザで http://localhost/test.html が正常に表示されることを確認した。


敷居が高いと思ってたけど、意外とサクッとインストールできたな。

セキュリティ的にこのままで大丈夫なのだろうか? あとで調べよう。


2019-06-15 Sat | ソフトウェア | トラックバック:0 | コメント:0
OnSaveBuild プラグインで _ を先頭に持つファイル名を除外する (Sublime Text 3)
Sublime Text 3 で、OnSaveBuild プラグインを使用。

scss などを保存時に自動コンパイルしてくれるので、チョー便利!

ただ、 _sample.scss など _ を頭に付けたファイルは保存時にビルドしてほしくないなー。

さっそく Preffrences → Package settings → SublimeOnSaveBuild → Settings - User をいじる。

( \ 記号は、Sublime の設定ファイル上ではバックスラッシュとして表示されてます)


設定ファイルは空っぽなので、以下を追加する

{
"filename_filter": "^(?!_).*\\.(sass|less|scss)$",
}


^ ... 行頭 or 文字列の先頭
$ ... 行末 or 文字列の最後
(?!_) ... ?! に続く文字ではない、の意。(この例では _ ではない、の意味)

これは、*.html 上で記述した Javascript では期待の動作をしたけれど、sublime 上では _ 付きファイルもなぜか全部ビルドされてしまった。

うーん、それではと、こちらを参考にして、
https://stackoverflow.com/questions/16090448/sublime-sass-exclude-with-regex

{
"filename_filter": "^[^_].*\\.(sass|scss)$|\\.(css|js|less)$"
}


と直すも、やはり期待した動作をせず。

※ [] で囲んだ中では、^ (キャレット) は 「次の文字ではない」 を表すらしい。…合ってるかな?


よく見ると、\ であるべき部分は、設定ファイルでは \\ となってる。
エスケープ文字をさらにエスケープしてるような…

わけも分からず試しに \\ をそのキャレットの前に付けてみたら、

{
"filename_filter": "^[\\^_].*\\.(sass|scss)$"
}


めでたく動作しました~☆

ちゃんと _sample.scss ではビルドせずにそのまま保存され、sample.scss ではビルドして保存されるように・・・・

ならない!!!!


実際やったらあれ、動作しない。
全部コンパイルされてしまう。

否定は効かないのだろうか。
Ctrl + F の文書内検索(正規表現) では動作するんだけどなぁ。

じゃ、これでどうだ!?

{
"filename_filter": "^[a-zA-Z0-9].*\\.(sass|scss)$",
}


アルファベットと数字ではじまるものだけ対象、って感じです。
気持ち悪いけどまぁ仕方ない。

あーけどこれも動作しないやー。


情報みっけ。

Avoid saving on partials / SublimeOnSaveBuild
https://github.com/alexnj/SublimeOnSaveBuild/issues/11#issuecomment-24952435

これでどうだ!!

{
"filename_filter": "(/|\\\\|^)(?!_)(\\w+)\\.(sass|scss)$", // this works.
}


やったー!! ちゃんと動作しましたー

もうこの正規表現の意味はよくわからないけどねー



2019-06-03 Mon | ソフトウェア | トラックバック:0 | コメント:0
Thank you for visiting me !
プロフィール

kobuchicken

  • 管理人: kobuchicken
  • Linux 初心者です。XP 無しで過ごした長い長い 98 の日々。Ubuntu & 派生ディストリの有難さを感じる今日この頃です。フリーの OS がもっと身近になりますように。
  • RSS
カレンダー
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 - - - - - -
05月 « 2019/06 » 07月
ブログ内を検索
Search this site.