Google Chromeがimportに対応した
対応するって話は知ってはいましたがとうとう対応したんですね。ちょっと興奮して久しぶりにブログを更新してます。
ES2017も正式勧告されたこのご時世にimport
を知らないwebエンジニアは少数だと思いますが、使い方はこちら。
Safariも最新版はiOSを含めて対応してると小耳に挟んだので他のブラウザ実装状況はどうだろうかとcan i use
で調べて見ました。
今のところこんな感じみたいでEdgeやFirefoxもデフォルトでは対応していないもののNot supported by default, but can be enabled.
とあるので設定変更するとかで有効にできるようです。
というわけでやってみた。
// hello.js const Hello = "hello" export default Hello
// sample.js import Hello from './hello.js' console.log(Hello)
<!-- index.html --> <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="module" src="./sample.js"></script> </body> </html>
chromeはローカルのファイルだと制限があるのでpythonのサーバーを立ち上げます。
$ python3 -m http.server
http://localhost:8000/index.html
をchromeで開くと・・
コンソールにhello
と表示されました。やったね!
ちなみにnode_modules
には対応してないのでそういうの使いたければ適当な場所に置いといて読み込むとか、これまで通りWebpack
などのモジュールバンドラーを使う必要があるそうです。
とは言ってもグローバル汚染しなくてもライブラリを扱えるのは素晴らしいです。
他のブラウザも早く対応して欲しいですね。