parcelを使ってVueをバンドルしようとしているのですが、
App.vueの1行目で「Unexpected token (1:0) >」というエラーが出ます。
解決策をしらべましたがよくわかりませんでした。
一回目のビルドの際のみ
「npm WARN [email protected] requires a peer of css-loader@* but none is installed. You must install peer de」というエラーメッセージが出ていました。
以下ファイルの階層はすべて同じです。
- package.json
"dependencies": {
"vue": "^2.6.8"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-plugin-transform-vue-jsx": "^3.7.0",
"babel-preset-env": "^1.7.0",
"parcel-bundler": "^1.11.0",
"parcel-plugin-vue": "^1.5.0"
}
- App.vue
<template>
<div>
{{ message }}
</div>
</template>
<style>
</style>
<script >
export default {
name: 'App',
data() {
return {
message: 'Hello Vue!'
}
}
}
</script>
- index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
</head>
<html>
<body>
<div id="app">
<script src="./index.js"></script>
</div>
</body>
</html>
- index.js
import Vue from 'vue'
import App from './App.vue'
new Vue({
render: h => h(App)
}).$mount('#app')
またもう一件、
package.jsonに以下を記載すると
"scripts": {
"start": "parcel index.html -o"
}
-o
オプションでエラーが出るのはなぜでしょうか?
error: option
-o, --out-file ' argument missing`