[Bug Report] Vuetify loader breaks JSX
See original GitHub issueEnvironment
Browsers: Chrome 76.0.3809.100 OS: Windows 10
Steps to reproduce
- Create new Vue CLI app (using defaults)
- Add Vuetify package (using defaults)
- Edit HelloWorld.vue: remove template and add a simple render function using JSX:
render () { return <div>hello</div> }
Expected Behavior
It should render “hello” div
Actual Behavior
Fails to compile:
ERROR Failed to compile with 1 errors 11:25:27
error in ./src/components/HelloWorld.vue?vue&type=script&lang=js&
Module parse failed: Unexpected token (4:11)
You may need an appropriate loader to handle this file type.
| export default {
| render () {
> return <div>hello</div>
| },
| data: () => ({
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js& 1:0-227 1:243-246 1:248-472 1:248-472
@ ./src/components/HelloWorld.vue
@ ./node_modules/vuetify-loader/lib/loader.js!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://192.168.1.155:8083/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
Reproduction Link
https://github.com/danbaechtold/repro-vuetify-jsx-bug
Other comments
- JSX works before adding Vuetify
- JSX also works again after removing vuetify-loader (npm uninstall)
Issue Analytics
- State:
- Created 4 years ago
- Reactions:15
- Comments:5 (1 by maintainers)
Top Results From Across the Web
vue-template-loader breaks vuetify components - Stack Overflow
I'm using vue-template-loader to load html files in .ts files using decorators, before I use it vuetify was working fine , but after...
Read more >Frequently asked questions — Vuetify
How do I report a bug or request a feature? The vuetify-loader doesn't load all components · How long will version 1.5 be...
Read more >vuetify-jsx-loader - npm
Start using vuetify-jsx-loader in your project by running `npm i vuetify-jsx-loader`. There are no other projects in the npm registry using ...
Read more >error when upgrading to 19.2 | Vue Forums - Syncfusion
The error completely goes away if syncfusion components are ... and we have confirmed it as a bug and logged the defect report...
Read more >Why I Converted from Vue to React - DEV Community
There is no magic in React, you simply return JSX? ... of typescript in general is limited to preventing other developers to break...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Any news on this? I have the same problem. After
vue add vuetify
the vuetify-loader is installed and JSX render functions stop working. Is there any way to fix this? ThanksSame issue here