语法错误:当前未启用对实验性语法“jsx"的支持 [英] Syntax Error: Support for the experimental syntax 'jsx' isn't currently enabled

问题描述

我无法使用我创建的 npm 组件包.我已经成功发布了该包，但是当我在新代码中使用它时，它显示此错误SyntaxError:/home/trinndra/Desktop/react-test/node_modules/iconbox1/index.js: Support for the Experimental syntaxjsx' 当前未启用 (6:17)"

我的包名称:iconbox1"

我的 npm 包代码在这里:

import React,{Component} from "react";欢迎类扩展组件{使成为(){返回 (<输入类型=文本"placeholder="你的名字"></input>)}}module.exports.Welcome = 欢迎；

我在我的主应用中使用它:

从'./logo.svg'导入logo；导入'./App.css';从iconbox1"导入{欢迎}功能应用(){返回 (
<欢迎></欢迎>
);}导出默认应用程序；

在此处输入图片说明

解决方案

您正在使用 ES6 和 ES5 语法进行导入和导出.

试试这个代码 这是输出的屏幕截图.它对我有用

检查文件名是否为iconbox1

import React,{Component} from "react";欢迎类扩展组件{使成为(){返回 (<输入类型=文本"placeholder="你的名字"></input>)}}导出默认欢迎；

//从'./logo.svg'导入logo；导入'./App.css';从./iconbox1"导入欢迎功能应用(){返回 (
<欢迎></欢迎>
);}导出默认应用程序；

I am unable to use my npm component package that i have created. I have published the package successfully but when i am using it in a fresh code it is showing this error "SyntaxError: /home/trinendra/Desktop/react-test/node_modules/iconbox1/index.js: Support for the experimental syntax 'jsx' isn't currently enabled (6:17)"

My package name:"iconbox1"

My npm package code is here:

import React,{Component} from "react"

class Welcome extends Component{
    render(){
        return (
                <input type="text" placeholder="Your name"></input>
        )
    }
}

module.exports.Welcome = Welcome;

And i am using it here in my main app:

import logo from './logo.svg';
import './App.css';
import {Welcome} from "iconbox1"


function App() {
  return (
    <div className="App">
      <Welcome></Welcome>
    </div>
  );
}

export default App;

enter image description here

解决方案

You are using both ES6 and ES5 syntax for importing and exporting.

Try this code instead Here's a Screenshot of the output. It's working for me

Check the name of the file is iconbox1 or not

import React,{Component} from "react"

class Welcome extends Component{
    render(){
        return (
                <input type="text" placeholder="Your name"></input>
        )
    }
}

export default Welcome;

// import logo from './logo.svg';
import './App.css';
import Welcome from "./iconbox1"


function App() {
  return (
    <div className="App">
      <Welcome></Welcome>
    </div>
  );
}

export default App;

这篇关于语法错误:当前未启用对实验性语法“jsx"的支持的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！