Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

No transformers found for .vue with Vue 3 and Parcel 2

See original GitHub issue

🐛 bug report

This seems like a rookie mistake, but I’m getting this error.

🚨 Build failed.
Error: No transformers found for "src/js/components/App.vue".

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

  "scripts": {
    "dev": "parcel src/html/index.html",
  },
  "dependencies": {
    "parcel": "^2.0.0-beta.1",
    "postcss-modules": "^3.2.2",
    "tailwindcss": "^1.9.6",
    "vue": "^3.0.2"
  },
  "devDependencies": {
    "sass": "^1.28.0"
  }

😯 Current Behavior

It seems like the basic doesn’t work for me right now, I think I have double checked everything but can’t figure out what’s wrong.

🔦 Context

Trying to get started with Parcel 2 and Vue 3.

💻 Code Sample

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>My First Parcel App</title>
  <link rel="stylesheet" href="../css/index.pcss">
</head>
<body class="font-body">

<div id="app"></div>

<script src="../js/index.js"></script>
</body>
</html>

index.js

import { createApp } from 'vue'
import App from './components/App.vue'

createApp(App).mount('#app')

App.vue

<template>
  <div class="container mx-auto py-4">

    <a href="#" class="btn">Test button</a>
  </div>
</template>
<script>

export default {
}
</script>

Issue Analytics

State:
Created 3 years ago
Comments:38 (27 by maintainers)

Top GitHub Comments

2reactions

101arrowzcommented, Dec 2, 2020

I’ve updated the Vue transformer “HMR fix” (not really at this point, but oh well). When #4935 is merged this issue can be closed.

2reactions

mischniccommented, Dec 2, 2020

Vue 3.0.4 was just released. It would be great if someone could verify that it now works correctly (apart from https://github.com/parcel-bundler/parcel/pull/4935).

Top Results From Across the Web

Vue - Parcel

Parcel supports Vue automatically using the @parcel/transformer-vue plugin. ... Note: Parcel does not support using SFCs with Vue 2, you must use Vue...

@parcel/transformer-babel | Yarn - Package Manager

This Parcel transformer plugin is responsible for transforming assets with Babel. It uses @babel/core to resolve babel config the same way Babel does...

@parcel/transformer-vue NPM | npm.io

Features. Blazing fast bundle times - multicore compilation, and a filesystem cache for fast rebuilds even after a restart.

vuejs3 - Parcel 2 + Vue 3 - How to set global feature flags ...

Everything went fine for setting up and launching a humble Hello World app except this warning in the browser's console: Feature flags __ ......

@parcel/transformer-vue - npm

This package does not have a README. Add a README to your package so that users know how to get started.