ローディングを表示させたいです。
index.htmlに
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>Vue.js App</title> <link href="main.css" rel="stylesheet"> </head> <body> <div id="app"> <transition name="view"> <router-view /> </transition> <LoadingOverlay /> </div> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script> <script src="./main.js"></script> </body> </html>
と書き、
main.jsに
export default{ beforeRouteEnter(to,from,next){ setTimeout(next,1000) } }
と
書き、
main.cssに
.loading-enter-active{ transition:all 0.25s; } .loading-leave-active{ transition:all 0.5s ease 0.5s; }
と書きました。
これらのコードを実行すると、
main.js:1 Uncaught SyntaxError: Unexpected token export とエラーが出ました。何が問題でしょうか?どう直せばいいのでしょうか?
環境をご提示ください。特にブラウザのバージョンを。