2

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`

0

1 件の回答 1

1

parcel のvueのプラグインが非推奨になっていたためのエラーでした。
parcel-plugin-vue をuninstallし、
package.jsonにalias "vue": "./node_modules/vue/dist/vue.common.js"を追加することで解決。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。