Skip to content
This repository has been archived by the owner on Jun 3, 2018. It is now read-only.

Vue SFC implementation failed. #23

Open
dbelyaeff opened this issue Feb 19, 2018 · 0 comments
Open

Vue SFC implementation failed. #23

dbelyaeff opened this issue Feb 19, 2018 · 0 comments

Comments

@dbelyaeff
Copy link

Hi there!

🐛 bug report

Vue SFC doesn't loads properly.

🎛 Configuration (.babelrc, package.json, cli command)

.babelrc

{
  "presets": ["env","vue"],
}

package.json

{
  "name": "parcel",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "start": "parcel index.pug"
  },
  "dependencies": {
    "babel-preset-vue": "^2.0.1",
    "parcel-plugin-pug": "^0.2.4",
    "parcel-plugin-vue": "^1.5.0",
    "pug": "^2.0.0-rc.4",
    "pug-loader": "^2.3.0",
    "vue": "^2.5.13"
  },
  "devDependencies": {
    "babel-preset-env": "^1.6.1",
    "coffeescript": "^2.2.0"
  }
}

index.pug

html
	head
		title Test
	body
		h1 Test
		#root
			app
		script(src="./app.coffee")

app.coffee

import Vue from 'vue/dist/vue.esm'
import App from './App'
new Vue
	el: "#root"
	render: (h) => h(App)

module.hot.accept() if module.hot

App.vue

<template lang="pug">
div
	h1 {{text}}
</template>
<script lang="coffee">
export default
	name: 'app'
	data: ()->
		text: 'Test'
</script>
<style lang="stylus">
background rgba(0,0,0,0.1)
</style>

🤔 Expected Behavior

Don't pay attention to pug and coffee. I've tried before using clean HTML and JS. The results were the same.

Every time I've got following error:

[Vue warn]: Failed to mount component: template or render function not defined.

🌍 Your Environment

Software Version(s)
Parcel Latest
Node Latest
npm/Yarn Latest
Operating System macOS Latest

At the same time I've get next error:

🚨  /Users/dima/Sites/parcel/App.vue:3:0: 'import' and 'export' may only appear at the top level (3:0)
  1 | <template lang="pug">
  2 | div
> 3 | 	h1 {{text}}
    | ^
  4 | </template>
  5 | <script lang="coffee">
  6 | export default

The error is about PUG template in Vue SFC App.vue. It's not a script section.

Looks like it's an error of embed linter.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant