reactjs - You may need an appropriate loader to handle this file type.
问题描述
I just made a package with npm publish and install back to fresh project but its giving the above this error
> ./node_modules/react-js-validator/src/inputs/EmailInput.js
Module parse failed: Unexpected token (38:12)
You may need an appropriate loader to handle this file type.
| render() {
| return (
| <div >
| <span className="error-span" style={this.props.styleError} >
| {this.state.errorStatus ? this.state.errorMsg : null}
from line no 38 my html div is starting.
my package.json of npm package is here
{
"name": "react-js-validator",
"version": "1.0.9",
"description": "a simple package for apply input validation on react js validation such as numaric,email,letter,custom rejex,minimum length and max length etc",
"main": "index.js",
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"author": "anil sidhu",
"license": "ISC",
"devDependencies": {
"autoprefixer": "7.1.2",
"babel": "^6.23.0",
"babel-cli": "^6.26.0",
"babel-core": "6.25.0",
"babel-eslint": "7.2.3",
"babel-jest": "20.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-react-app": "^3.0.3",
"babel-runtime": "6.26.0"
},
"transpile": "babel src/index.js --out-file src/index-transpiled.js"
}
解决方案
I just got the answer we can not use pure html code in npm package for react. use code like this
render() {
let collection = React.createElement("div", {},
React.createElement("span", { className: 'error-span' }, this.state.errorMsg),
React.createElement("input", {
type: "text",
onChange: (e) => this.Valid(e.target.value),
onClick: (e) => this.props.return(this.state.errorStatus)
}
)
)
return (collection)
}
推荐阅读
- mysql - MYSQL - 使用包含假期的日期行查找行增量
- linux - 将 Expect 与 shell 脚本捆绑以绕过 Expect 的安装
- java - java.lang.NumberFormatException:对于输入字符串:“-5,25”
- python - 即使安装了 BeautifulSoap 的 ImportError
- angular - 以反应方式使用异步管道处理可观察到的错误
- c# - 使用“ObjectList.Contains(foo)”时,对象列表无法正确比较
- python-3.x - 如何单击特定的复选框
- php - Simplehtmldom 多链接保存
- java - 将 junit.Test 和 junit.Assert.* 导入 NetBeans java 项目
- ios - iOS PresentViewController 带键盘