Tag: reactjs

意外的令牌导入native-base-shoutem-theme / index.js：1可能是native-base / react-native

）我有一个很大的问题，我花了整整一天的时间来解决这个问题，并在几个软件包的依赖关系之间find了共识 我在运行testing时遇到问题： Users/P/Projects/react-native/node_modules/native-base-shoutem-theme/index.js:1 ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import connectStyle from './src/connectStyle'; ^^^^^^ SyntaxError: Unexpected token import at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:289:17) at Object.<anonymous> (node_modules/native-base/dist/src/index.js:1:1133) at Object.<anonymous> (app/index.js:18:96) 现在我search反应的好版本，react-native，react-dom，native-base和react-test-renderer。 我尝试了新的和旧的，但有时我有这个错误，有时其他人..我决定修复这一个，因为它的一些最新版本的问题。 我的NPM： “babel-cli”：“6.24.1”，“react-native”：“0.44.0”，“native-base”：“2.1.2”，“react”：“16.0.0-alpha.3” “react-test-renderer”：“16.0.0-alpha.3” 节点版本7.7.2 npm版本4.1.2 如果你有其他WORKING的可选版本，请通过我这些或帮助解决这个错误;）我认为我将能够解决它与react-native init比较，有testing正在为我工​​作，但不是在我的项目..我不知道什么是错的： 我知道这有点棘手，但请帮助我;） 编辑：在版本react-native 0.45.0我有这个错误💃 ● Test suite failed to run TypeError: Cannot read property 'ReactCurrentOwner' of undefined at Object.<anonymous> (node_modules/react-native/Libraries/Renderer/src/renderers/shared/ReactGlobalSharedState.js:18:33) at Object.<anonymous> (node_modules/react-native/Libraries/Renderer/src/renderers/shared/ReactDebugTool.js:18:1) at Object.<anonymous> (node_modules/react-native/Libraries/Renderer/src/renderers/shared/ReactInstrumentation.js:19:20) […]

如何在一个反应​​组件中返回一个http错误？

在服务器端，reactjs组件应该如何通知节点应用程序返回一个http错误？ 我的第一个想法是抛出一个错误： var notFound = function () { var error = new Error("Not Found"); error.httpError = 404; throw error; }; var App = React.createClass({ render: function () { return react.DOM.div(null, Locations({path: this.props.path}, Location({path: "/", handler: home}), NotFound({handler: notFound}) ) ); } }); try { res.send(React.renderComponentToString(app())); } catch (err) { if(err.httpError) { res.send(err.httpError); } else { […]

如何处理nodejs上的窗口对象，以供reactjs应用程序的服务器端呈现

我正在尝试为我的reactjs应用程序实现服务器端呈现。 我正在使用webpack构buildreactjs应用程序，增强解决scheme来处理nodejs中的jsx文件的导入。 我的应用程序依赖于像enquire.js这样的第三方库。 当应用程序尝试在nodejs上导入enquire.js时，它会失败，并显示错误ReferenceError: window is not defined 由于窗口对象不可用nodejs如何处理使用窗口进行服务器端呈现的库？

服务器端反应路由器不会呈现我的路线

我与版本1.0.0-rc1和我的匹配函数将不会正确呈现我的路线。 这是我的服务器 import express from 'express'; import React from 'react'; import createLocation from 'history/lib/createLocation' import Router, { match, RoutingContext } from 'react-router'; import createRoutes from './create-routes'; const app = express(); const routes = createRoutes(); app.use((req, res) => { let location = createLocation(req.url); match({ routes, location }, (error, redirectLocation, renderProps) => { if (redirectLocation) res.status(301).redirect(redirectLocation.pathname + […]

meteorbuild立打破部署到Heroku

我没有改变任何依赖关系，但是当我部署到Heroku的时候，我的构build突然间崩溃了。 请参阅下面的错误消息获取更多信息 —–> Fetching set buildpack https://github.com/AdmitHub/meteor-buildpack-horse.git… done —–> Node.js app detected —–> Installing node —–> Installing meteor Downloading Meteor distribution Meteor 1.3 has been installed in your home directory (~/.meteor). Now you need to do one of the following: (1) Add "$HOME/.meteor" to your path, or (2) Run this command as root: cp "/tmp/buildpack20160403-165-1y59l1z/meteor-j9kn/.meteor/packages/meteor-tool/1.3.0_3/mt-os.linux.x86_64/scripts/admin/launch-meteor" […]

如何在服务器上呈现我的反应组件而不用大量修改现有的应用程序？

我的server.js文件是写在节点上，如下所示： var path = require('path'); var express = require('express'); var app = express(); var PORT = process.env.PORT || 8080 // using webpack-dev-server and middleware in development environment if(process.env.NODE_ENV !== 'production') { var webpackDevMiddleware = require('webpack-dev-middleware'); var webpackHotMiddleware = require('webpack-hot-middleware'); var webpack = require('webpack'); var config = require('./webpack.config'); var compiler = webpack(config); app.use(webpackDevMiddleware(compiler, { noInfo: true, […]

如何在React应用程序中使用webpackasynchronous需要模块？

在React应用程序中，我想导入一个名为flowtime.js的库，仅用于特定的path/path，然后执行更多的代码。 这个库有一个名为Brav1toolbox的依赖项 。 在npm上都不可用。 我的策略是在Component的componentDidMount方法中使用webpack的require 。 这是我的尝试： componentDidMount() { require.ensure([ 'local/relative/path/to/lib/brav1toolbox.js'], function(require) { var f = require('local/relative/path/to/other/lib/Flowtime.js/js/flowtime.js'); }); } 这会导致以下错误。 Uncaught（承诺）ReferenceError：Brav1Toolbox未定义 所以Flowtime正在加载，但无法findBrav1Toolbox。 我没有React或webpack的经验，所以也许我有一个误解。 我正在尝试使用webpack来只加载这些库，如果我的用户访问需要这些库的path。 这是我用作参考的webpack指南 。 感谢您的帮助。

服务器端与REDX渲染

我有一个简单的应用程序与reactjs和redux构build。 作为即时开始学习REDX我有一些问题做服务器端渲染。 我到目前为止是…客户端App.js呈现应用程序组件。 render( <Provider store={store}> <App /> </Provider>, document.body ); 应用程序组件： const App = () => ( <div> <SearchContainer /> <TodoContainer /> </div> ) 如果两个项目都是容器，SearchContainer从input框中获取input，发起一个正在调度带有加载待办事项（来自远程rest服务）的消息的操作。 现在编号喜欢加载在服务器端的页面加载的待办事项，并显示一次页面显示。 我会怎么做呢？ 有没有办法在页面实际显示之前不使用服务器端渲染和加载项目？ 目前为止，route.js文件是： const middleware = [ thunk ] if (process.env.NODE_ENV !== 'production') { middleware.push(createLogger()) } const store = createStore(reducer,applyMiddleware(…middleware)) app.get('/', function(req, res) { res.render('home',{ markup: ReactDOMServer.renderToString( <Provider […]

React Native构build警告问题？

在运行react-native init reactApp我得到一个警告npm WARN react-native@0.39.2 requires a peer of react@~15.4.0-rc.4 but none was installed 。 构build是成功的，虽然这是我的package.json构build之后。 { "name": "reactApp", "version": "0.0.1", "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest" }, "dependencies": { "react": "15.4.1", "react-native": "0.39.2" }, "devDependencies": { "babel-jest": "18.0.0", "babel-preset-react-native": "1.9.1", "jest": "18.0.0", "react-test-renderer": "15.4.1" }, "jest": { "preset": "react-native" } […]

服务器渲染react-router v4 passthrough如果404

在react-router v3中，我们可以知道服务器端渲染何时与当前url不匹配。 这允许我将请求传递给我的express.static中间件，而不是发送呈现的应用程序。 在反应路由器v4中，我们必须使用 const htmlData = renderToString( <StaticRouter location={req.url} context={context} > <App/> </StaticRouter> ); 以便在服务器端渲染。 但是，它会自动将所有内容redirect到/ 。 为什么这种行为甚至存在？ 难道我们不能像我们所期望的那样错误地失败吗？ 我怎么能知道没有匹配的东西，我可以打电话给next() ，让另一个快递的路线做这个工作？ 这是我想要使用的整个function： app.get('*', (req, res, next) => { const context = {}; const htmlData = renderToString( <StaticRouter location={req.url} context={context} > <App/> </StaticRouter> ); console.log(JSON.stringify(context, null, 4)); // empty object if (context.url) { // <———————— […]