- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试将 styled-jsx 与一些代码一起使用。但是,无论我做什么,我似乎都会遇到错误
index.js:1437 Warning: Received `true` for a non-boolean attribute `jsx`.
If you want to write it to the DOM, pass a string instead: jsx="true" or jsx={value.toString()}.
in style (at App.js:12)
in div (at App.js:9)
in Test (created by Route)
in Route (at App.js:29)
in Router (created by BrowserRouter)
in BrowserRouter (at App.js:27)
in App (at src/index.js:7)
{
"name": "preview",
"version": "0.1.0",
"private": true,
"dependencies": {
"contentful": "^7.4.1",
"react": "^16.8.6",
"react-dom": "^16.8.4",
"react-router-dom": "^4.3.1",
"react-scripts": "^3.0.1",
"socket.io-client": "^2.2.0",
"styled-jsx": "^3.2.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"babel": {
"presets": [
"@babel/preset-stage-2"
],
"plugins": [
"styled-jsx/babel"
]
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"proxy": "http://localhost:5000/"
}
const Test = () => {
return (
<div>
<p>test
</p>
<style jsx>{
`
p {
color: red;
}
`
}
</style>
</div>)
}
class App extends Component {
render () {
return (
<Router>
<Route path='/test' component={Test}/>
</Router>
)
}
}
export default App;
最佳答案
好的。由于我自己花了几个小时才解决这个问题,我希望我能帮助你们也有这个问题。
要将 styled-jsx 与 create-react-app 一起使用,您需要:
yarn add react-app-rewired customize-cra
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
和
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
package.json
旁边)文件 config-overrides.js
const { override, addBabelPlugin, addBabelPreset } = require('customize-cra');
module.exports = override(
addBabelPlugin('styled-jsx/babel')
);
.babelrc
(它只在你运行 jest test
时使用) {
"plugins": ["styled-jsx/babel"]
}
index.js
(或者你将 React 挂载到 DOM 的位置),在调用 ReactDOM.render(....) 之前,插入以下代码,
const _JSXStyle = require('styled-jsx/style').default;
if (typeof global !== 'undefined') {
Object.assign(global, { _JSXStyle });
}
不幸的是,如果没有它,这种复杂的配置有点变化无常。
yarn build
时才需要第 4 步和第 5 步或
yarn test
使用创建 react 应用程序。
关于reactjs - 警告 : Received `true` for a non-boolean attribute `jsx` . 时代风格的 Jsx,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57261540/
你好,我正在尝试在 opensuse 中创建一个 Shell 脚本来创建 MySqlUsers,但是当我尝试运行它时,我得到了这个错误: Warning: Could not start progra
我阅读了有关此错误的所有信息,但未能找到任何解决方案。 我有一个看起来像这样的简单页面: $xmlfile = "/var/www/marees.xml"; //Fichier dans lequel
运行 Websphere App 服务器 V8.5 Liberty Profile。我找不到任何可以解决这些警告的帮助。我在 eclipse 。 ************** He
我尝试在 GC AppEngine 上部署应用程序。部署过程中没有错误,但应用程序无法运行(仅显示加载页面)。日志中唯一一个奇怪的原始 OpenBLAS WARNING - could not det
我刚开始学习 RestKit。我正在尝试使用它来使用 Foursquare api 获取附近的 field 。但每次我尝试“objectLoader:(RKObjectLoader *)objectL
我对 Vuejs 比较陌生,每次按键时都会收到以下警告: [Vue warn]: $attrs is readonly. found in ---> at src\component
Warning: simplexml_load_file() [function.simplexml-load-file]: I/O warning : failed to load external
我在尝试修改某些表时不断收到此错误。这是我的代码: /** = 1){ //$this->mysqli->autocommit(FALSE); //insert th
当我尝试使用 PHP 的 ftp_put 函数上传文件时,早些时候出现错误: 警告:ftp_put() [function.ftp-put]:无数据连接 现在,我尝试开启被动模式: ftp_pasv(
我一直在努力让这段代码适用于现阶段的年龄。它旨在计算一个范围内的素数,我已经编写了一种方法来打印它们。不幸的是,代码将无法编译,引用警告: “警告:[未检查] 未检查调用 add(E) 作为原始类型
尝试使用带有架构组件和Kotlin的Android Studio 3 Canary 5构建示例会给出此警告。 谁能告诉我原因? 谢谢,Ove 编辑#1: 这是Dan Lew前段时间制作的样本 http
我正在编写一个 Shiny 的应用程序,它运行得非常好,突然我收到两条警告消息。我已经回到以前运行良好的副本,它们现在显示相同的错误消息,所以我真的很困惑。我的代码仍然运行并在我 Shiny 的仪表板
03-25 05:52:15.329 8029-8042/com.mgh.radio W/MediaPlayerNative: info/warning (703, 0) 03-25 05:52:15
我在构建时在我的 gradle 控制台中收到一条警告消息: 警告:[options] 引导类路径未与 -source 1.7 一起设置 1 条警告 我怎样才能解决这个问题? 任何帮助表示赞赏! 最佳答
我有下一个代码: 测试.c #include "a1.h" int main() { int a = 8; foo(a); return a; } a1.h void foo
我的程序中有一个 WORD 变量。 WORD hour; 但是当我比较它的时候 if(hour>=0 && hour=0 && hour=0 的比较,它始终适用于 hour 是 WORD 类型,它是一
安全研究人员警告称,一个最新的严重的Java错误,其本质与目前在全球范围内利用的臭名昭著的 Log4Shell 漏洞相同 。 CVE-2021-42392 尚未在国家漏洞数据库 (NVD) 中
安装SqlServer2005时“版本变更检查 (警告)"问题排查 今天同事在安装SqlServer2005时遇到“版本变更检查 (警告) ”问题导致安装失败,警告提示如下: - 版本
我的 UWP 项目中出现以下警告。我已经标记了解决方案的示例,但我更感兴趣的是为什么在同一平台上创建另一个空项目时不会出现此警告? APPX4001: Build property AppxBundl
我试图修复我的登录脚本,在我的本地主机上它可以工作,但上传到我的在线测试服务器时,注销被破坏,我得到这个错误: Warning: session_destroy() [function.session
我是一名优秀的程序员,十分优秀!