我正在尝试创建一个针对 iOS 和网络平台构建的 react-native-for-web 应用程序。我的问题的解决方案是让 xcode/mac 模拟器在热重载 iOS 版本的情况下运行,同时还运行 Web 版本的“react-native-web”:“^0.9.x”应用程序。
我在谷歌上搜索了如何开始其中一篇文章,发现前几篇文章是由 create-react-native-web-app 的创建者撰写的,所以我决定试试这个方法。然而,这是一场艰苦的战斗。
但首先,似乎开箱即用的部分是 Web 部分。在我的第一次尝试中,在运行 npx create-react-native-web-app demo-app 之后,yarn web 立即起作用。 :)
但是 yarn iOS 无法构建,并且存在多个问题。
我有 node -v >> v11.5.0。我在 Mohave,已经设置了 xcode 10.1(用于 iOS 开发)。
yarn iOSios/ 下的creaternwapp 项目并将Project Settings > Build System 更改为Legacy Build System。 (cd node_modules/react-native/third-party/glog-0.3.4/&& ./configure)//这些数字可能会明显改变,具体取决于安装无论是否需要,我都将 .babelrc 更改为:
{
"presets": ["module:metro-react-native-babel-preset"],
}
到:
{
"presets": [["module:metro-react-native-babel-preset"], ["react-app"]],
"ignore": ["node_modules/art/core/color.js"],
"plugins": [
["module-resolver", {
"alias": {
"^react-native$": "react-native-web"
}
}]
],
}
npm install && npm audit fix,然后是 yarn install,这样 yarn 就可以重新获得控制权。此时 yarn ios 成功,但 setTimeout 的错误显示在模拟器上。我对此进行了研究,显然当 react-native 安装未完成时会发生此类错误,建议使用 yarn upgrade react native 的解决方案。但是 yarn upgrade react-native@0.57.8 对我来说没有任何改变。
最佳答案
这不是我正在寻找的答案,我希望 create-react-native-web-app 开箱即用..但现在 - 这是我使用的方式rn + rnw ,即使是 react-native-paper:
我可以描述如何让 react-native-paper 在 expo 中工作。
expo init --yarn --template blank demo-app-- cd demo-app
yarn 添加 react-native-web react-router-dom react-router-native react-app-polyfill react-art react-native-paper react-dom-- yarn add -D react-scripts @babel/preset-flow @babel/plugin-proposal-class-properties
编码 package.json 并添加脚本:
“网络”:“ react 脚本开始”, "build-web": "react-scripts 构建"
-- 我们将作弊并就地编辑它们。更好的做法是将 node-modules/react-scripts/config 和脚本复制到您的项目文件夹中,安装它们的依赖项并让它们在本地工作。但这只是一个概念验证(所以 .. 请确保暂时不要重新安装 node_modules 或 react-scripts)
-- 配置/添加主要内容:
"main": "react-native-main.js",
代码 react-native-main.js 保存:import { KeepAwake, registerRootComponent } from 'expo'
import App from './src/App'
if (__DEV__) {
KeepAwake.activate()
}
registerRootComponent(App)
mkdir src public
rm App.js
-- code src/App.js 保存:
import React from 'react'
import { StyleSheet, View } from 'react-native'
import { Provider as PaperProvider } from 'react-native-paper'
import { Router, Switch, Route } from './routing'
import Home from './Controllers/Home'
export default class App extends React.Component {
render () {
return (
<PaperProvider>
<View style={styles.app}>
<Router>
<Route exact path="/" render={props => <Home {...props} />} />
</Router>
</View>
</PaperProvider>
)
}
}
const styles = StyleSheet.create({
app: {
flex:1
}
})
mkdir src/Controllers && code src/Controllers/Home.js 保存:(需要制作一些东西来演示 Paper ..这实际上只是示例文件夹中的文本示例)/* @flow */
import React from 'react'
import { View, StyleSheet, Platform } from 'react-native'
import {
Caption,
Headline,
Paragraph,
Subheading,
Title,
withTheme,
type Theme,
} from 'react-native-paper'
type Props = {
theme: Theme,
};
class TextExample extends React.Component<Props> {
render() {
const {
theme: {
colors: { background },
},
} = this.props
return (
<View style={[styles.container, { backgroundColor: background }]}>
<Caption style={styles.text}>Home</Caption>
<Paragraph style={styles.text}>This is the home component</Paragraph>
<Subheading style={styles.text}>home component</Subheading>
<Title style={styles.text}>Home</Title>
<Headline style={styles.text}>Home on { Platform.OS }</Headline>
</View>
)
}
}
const styles = StyleSheet.create({
container: {
padding: 16,
flex: 1,
},
text: {
marginVertical: 4,
},
})
export default withTheme(TextExample)
code public/index.html 保存:<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Third Party Demo</title>
</head>
<body>
<div id="react-native-web-app"></div>
</body>
</html>
code src/index.js 保存:import React from 'react'
import ReactDom from 'react-dom'
import App from './App'
ReactDom.render(<App />, document.getElementById('react-native-web-app'))
code src/routing.native.js 保存:从 'react-router-native' 导出 { NativeRouter as Router, Switch, Route, Link}
-- code src/routing.web.js 保存:
从 'react-router-dom' 导出 { BrowserRouter as Router, Switch, Route, Link}
yarn ios应该可以工作,但是 yarn web 给出了此处报告的错误。我们需要编辑 react-scripts Webpack 配置 node_modules/react-scripts/config/webpack.config.js:-- 标记部分的插件:
// Process application JS with Babel.
// The preset includes JSX, Flow, TypeScript, and some ESnext features.
(大约在第 387 行)添加这个插件:
[
"@babel/plugin-proposal-class-properties",
{
"loose": false
}
]
在该部分之后,创建一个新部分:
// Process paper specially
{
test: /\.js$/,
exclude: /node_modules(?!\/react-native-paper|\/react-native-vector-icons)/,
use: {
loader: require.resolve('babel-loader'),
options: {
babelrc: false,
configFile: false,
compact: false,
presets: [
'@babel/preset-env',
'@babel/preset-react',
'@babel/preset-flow',
],
cacheDirectory: true,
plugins: [
[
"@babel/plugin-proposal-class-properties",
{
"loose": false
}
],
],
// Don't waste time on Gzipping the cache
cacheCompression: false,
// If an error happens in a package, it's possible to be
// because it was compiled. Thus, we don't want the browser
// debugger to show the original code. Instead, the code
// being evaluated would be much more helpful.
sourceMaps: false,
},
}
},
关于ios - "Unhandled JS Exception: Can' t 仅在 iOS 中找到变量 setTimeout",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54328936/
我正在尝试测试是否存在表单。我是Rails新手。我的new.html.erb_spec.rb文件的内容是:require'spec_helper'describe"messages/new.html.erb"doit"shouldrendertheform"dorender'/messages/new.html.erb'reponse.shouldhave_form_putting_to(@message)with_submit_buttonendendView本身,new.html.erb,有代码:当我运行rspec时,它失败了:1)messages/new.html.erbshou
我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-
我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t
为了将Cucumber用于命令行脚本,我按照提供的说明安装了arubagem。它在我的Gemfile中,我可以验证是否安装了正确的版本并且我已经包含了require'aruba/cucumber'在'features/env.rb'中为了确保它能正常工作,我写了以下场景:@announceScenario:Testingcucumber/arubaGivenablankslateThentheoutputfrom"ls-la"shouldcontain"drw"假设事情应该失败。它确实失败了,但失败的原因是错误的:@announceScenario:Testingcucumber/ar
我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他,以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时,出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer
在MRIRuby中我可以这样做:deftransferinternal_server=self.init_serverpid=forkdointernal_server.runend#Maketheserverprocessrunindependently.Process.detach(pid)internal_client=self.init_client#Dootherstuffwithconnectingtointernal_server...internal_client.post('somedata')ensure#KillserverProcess.kill('KILL',
我正在查看instance_variable_set的文档并看到给出的示例代码是这样做的:obj.instance_variable_set(:@instnc_var,"valuefortheinstancevariable")然后允许您在类的任何实例方法中以@instnc_var的形式访问该变量。我想知道为什么在@instnc_var之前需要一个冒号:。冒号有什么作用? 最佳答案 我的第一直觉是告诉你不要使用instance_variable_set除非你真的知道你用它做什么。它本质上是一种元编程工具或绕过实例变量可见性的黑客攻击
我已经从我的命令行中获得了一切,所以我可以运行rubymyfile并且它可以正常工作。但是当我尝试从sublime中运行它时,我得到了undefinedmethod`require_relative'formain:Object有人知道我的sublime设置中缺少什么吗?我正在使用OSX并安装了rvm。 最佳答案 或者,您可以只使用“require”,它应该可以正常工作。我认为“require_relative”仅适用于ruby1.9+ 关于ruby-主要:Objectwhenrun
我花了三天的时间用头撞墙,试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上,从现在开始,您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳
我正在编写一个gem,我必须在其中fork两个启动两个webrick服务器的进程。我想通过基类的类方法启动这个服务器,因为应该只有这两个服务器在运行,而不是多个。在运行时,我想调用这两个服务器上的一些方法来更改变量。我的问题是,我无法通过基类的类方法访问fork的实例变量。此外,我不能在我的基类中使用线程,因为在幕后我正在使用另一个不是线程安全的库。所以我必须将每个服务器派生到它自己的进程。我用类变量试过了,比如@@server。但是当我试图通过基类访问这个变量时,它是nil。我读到在Ruby中不可能在分支之间共享类变量,对吗?那么,还有其他解决办法吗?我考虑过使用单例,但我不确定这是