前提・実現したいこと
Stimulus をはじめようを参考に、手元で再現しながら学習しようとしているのですが、初っ端からエラーでつまづいてます。
HELLO WORLDの項(codepen)をコピペして次のindex.htmlとhello_controller.jsを作りました。簡易なNginxサーバを立てて、ドキュメントルートに2つのファイルを配置しただけの環境です。ブラウザはChrome
しかし、hello_controller.jsの1行目でUncaught SyntaxError: Cannot use import statement outside a module
のエラーになりalertは出ません。
何が足りないのでしょうか?
発生している問題・エラーメッセージ
Uncaught SyntaxError: Cannot use import statement outside a module
該当のソースコード
html
/* index.html */ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script type="module"> import {Controller, Application} from "https://cdn.skypack.dev/stimulus@2.0.0"; </script> <script type="text/javascript" src="hello_controller.js"></script> </head> <body> <div data-controller="hello"></div> </body> </html>
javascript
// hello_controller.js import {Controller, Application} from "https://cdn.skypack.dev/stimulus@2.0.0"; let app = Application.start(); app.register('hello', class extends Controller { connect() { alert('HELLO WORLD') } })
試したこと
src="hello_controller.js"
をsrc="./hello_controller.js"
にしてみたり
補足情報(FW/ツールのバージョンなど)
Google Chrome
バージョン: 97.0.4692.99(Official Build) (arm64)
まだ回答がついていません
会員登録して回答してみよう