问题标签 [preact]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - 试图找到一个非常基本的 preact.js 设置,我可以在其中调试源代码
我的问题(我认为)相当简单。我正在尝试深入研究 preact.js 的内部结构,但不确定如何去做。我的意思是,我可以让框架正常工作;我通过 preact-boilerplate 设置中的 webpack 构建来做到这一点。再一次,工作正常,但似乎有太多的转译和源映射和热加载,不管其他什么让这些框架如此快速和花哨,我似乎无法真正拦截代码,所以我可以做无聊的调试诸如 console.log 之类的东西。
当然,我可以在 node_modules 文件夹中找到 preact 源代码;但是,此代码似乎不是实际运行/编译的代码。我怀疑这是因为由于 webpack 或 babel 或谁知道,所有内容都在实时转译。无论如何——我只想要一个可以使用 preact.js 但我可以实际访问代码的设置。想想一个在标签中带有 jquery 文件的普通网站。类似的事情......虽然我知道理论上我可以做一些事情,比如将 preact.js 添加到主 index.html 页面上的脚本标记中,但由于 babel 转译等原因会出现并发症。至于通过 webpack 配置选项来做这件事的某种方式,这超出了我的薪酬等级……但这样的配置选项也可以。在一个完美的世界里,
这是一个奇怪的问题,因为我实际上正在努力使事情变得简单。我觉得我在要求看电视,但是虽然这个地方很糟糕,有 90 英寸的纯平屏幕,但我只需要一个带有真空管的简单黑白。任何帮助,将不胜感激。非常感谢。
preact - 在 preact 应用程序中创建 .babelrc 需要什么
我从 Preact 应用程序开始。文件说_
最好不要在代码中声明 @jsx pragma,而是在 a 中全局配置它 .babelrc
:
对于 Babel 5 及之前版本:
对于通天塔 6:
我是 Preact 世界的新手,想了解为什么我们需要创建这个文件以及 jsx pragma 是什么?
javascript - Preact 和 FabricJS
我开始使用 preact 开发一个应用程序,我想知道是否可以在 preact 中使用 FabricJS。有人可以帮我理解我该怎么做吗?
reactjs - 在 Preact 中创建可插拔组件
我已经开始使用 preact 创建一个占用空间更小的 pwa。到目前为止一切顺利,该应用程序几乎作为模块化组件完成。
当我尝试将此组件插入另一个 React Web 应用程序时,天堂中的麻烦就出现了。preact 组件只是在 go 上呈现。而我想在我自己的视图层次结构中实例化这个组件。
就像是:
但是一旦我尝试包含bundle.js
来自 Preact 的构建,它就会呈现为body
擦除其他所有内容。
有什么我想念的吗?
这是Preact
index.js
理想情况下,这应该给了我一个组件<Player/>
,但它是自己渲染的。我什至没有使用Preact.render()
reactjs - preact compat 导致组件无限安装
我有使用 redux 和 react 路由器的 reactjs 应用程序。我想切换到preact。当我将 webpack 配置更新为别名 react 和 react dom 时。组件开始无限安装。它安装然后卸载..继续这样做。Webpack 配置。
反应.js
这个文件是因为我使用的是 react hot loader。React 应用程序运行良好.. 但添加 preact 有错误。请指导我。
typescript - 将 Jest 与 Typescript + preact 一起使用
将 JSX 编译到h()
测试中的问题。所有配置文件都类似于 create-react-app,排除对TypeScript
和的更改preact
我通过create-react-app my-app --script=react-scripts-ts
- 为 TypeScript 项目创建应用程序。然后弹出并更改react
为preact
(不要使用preact-compat
)。
为了迁移到preact
我添加package.json
到babel.plugins section
新插件["babel-plugin-transform-react-jsx", { pragma: "h"}]
中 - 用于转换<JSX />
为h(JSX)
函数调用,而不是默认React.createElement(JSX)
(迁移指南https://preactjs.com/guide/switching-to-preact)。
这很好用。
但是 test 有不同的转译配置<JSX />
:它React.createElement(JSX)
是默认转译。在测试中我犯了一个错误ReferenceError: React is not defined at Object.<anonymous> (src/Linkify/Linkify.test.tsx:39:21)
。如果我手动更改<JSX />
为h(SomeComponent)
在测试和测试文件中 - 它可以工作。
如何转译<JSX />
为h(JSX)
测试?
测试样品:
javascript - 在 Preact 应用程序中更新 Pinterest 嵌入
我有一个组件需要根据应用程序的状态加载更改的 Pinterest 嵌入。Pinterest 嵌入由一个标签组成,该标签通过使用我的 HTML 底部的异步脚本(可在此处<a>
获得)转换为标签内的复杂布局。但是,我无法弄清楚如何在使用更新的道具重新渲染时清除旧嵌入并重新运行脚本以渲染新嵌入。谢谢!<span>
<span>
我的组件: