Tag: reactjs

在Express中使用客户端路由服务多个反应应用程序: 对于单个服务，我有不同的软件产品，需要将其部署到单个服务器上。客户端是通过create-react-app来构build的，服务器运行Node.js和Express。当我从服务器提供单个应用程序时，将按以下方式完成： // App.js // … // Entry point for data routes (API) app.use('/data', indexRoute); if(process.env.NODE_ENV !== 'development') { app.use(express.static(path.join(__dirname, 'build-client'))); app.get('/*', function(req, res) { return res.sendFile(path.resolve( __dirname, 'build-client' , 'index.html')); }); } 我希望能够从服务器提供多个应用程序。我该怎么做？我所尝试的是在不同的静态path中连接资源，并用不同的名称分隔客户端，尽pipe它不起作用。喜欢这个： // App.js // … // Entry point for data routes (API) app.use('/data', indexRoute); if(process.env.NODE_ENV !== 'development') { […]

使用Webpack捆绑后端（Node）代码有什么好处？: 相关： “Webpack为后端？” “没有理由不使用节点/ io.js代码的webpack …” 通过weback打包整个应用程序的macros伟目标。使用Webpack捆绑服务器端代码的目的是什么？使用Webpack + Node与Node相比有没有什么优势？热重新载入你说？在开发过程中，热重新加载是否比自动服务器重新启动（通过nodemon或相关工具）要好得多？别名结束../../../../噩梦？还有很多其他的解决scheme ，包括babel-plugin-module-resolver 。如果您正在构build一个带有Node（后端）后端和React前端的Web应用程序，特别是使用预先configuration了Webpack的Create React App构build的前端？我已经更新了我的问题，包括促使我提出这个问题的参考资料，但仍被搁置。为什么是这样？

如何使用Node将ReactJS组件呈现为HTMLstring？: 使用node server.js运行此代码时： var React = require('react'); var HelloMessage = React.createClass({displayName: "HelloMessage", render: function() { return React.createElement("div", null, "Hello ", this.props.name); } }); var markup = React.renderComponentToString(HelloMessage({name: "John"})); console.log(markup); 我得到以下错误： /Users/john/Sites/test/server.js:9 return React.createElement("div", null, "Hello ", this.props.name); ^ TypeError: Object #<Object> has no method 'createElement' 我认为这是行不通的，因为服务器上没有DOM，这是有道理的。我如何渲染/编译ReactJS组件到Node中的HTMLstring？谢谢

nwjs reactjs，混淆了我的背景。文档是不确定的: 在我的nwjs应用程序中，我使用React来构build我的UI。目前， React正在通过主文件index.html中的<script>标签加载。 index.html有另一个<script>标签，它载入main.js，它包含定义和渲染我的React组件的代码，以及require() ）几个Node模块，比如“fs”和“McFly”。这一切似乎工作，但是当我尝试使用另一个节点模块（react-inlinesvg）我得到一个错误，“文件是未定义的”。在网上寻求帮助后，我得出结论React现在认为它正在服务器上运行？奇怪的是，和之前我开始使用react-inlinesvg模块一样，它使用React.render （客户端渲染）很高兴地渲染组件。如果您需要更多的背景或信息，请询问。

Nodejs的EventEmitter和JQuery的触发器: 我正在使用React + Flux开发一个应用程序。在facebook聊天的例子中，它使用节点EventEmitter来触发事件。然而，据我所知，jQuery也可以做pub / sub作业，使用$(ele).trigger 。两者有什么区别？性能也会起作用吗？

使用Express设置React应用程序: 我第一次在这里发表，我对networking开发完全陌生，所以如果在这里有类似的东西（我有一个很好的search），我提前道歉！总之，我正在制作一个应用程序，根据用户的searchinput从Instagram获取图像。挺容易。但是，我正在使用Node和Express服务器端和React客户端，我已经search了很多React教程，Express教程，我很困惑如何开始。每个教程都使用不同的依赖关系（我曾尝试Google了解它们的工作原理），并且在某些时候并不明确将代码放在哪里 – 我已经看到了app.js，server。 js，templates.jsx。希望有人可以用外行的话来解释，帮助我们新手。所以基本上，我想了解如何设置我的应用程序和我将需要什么文件，例如app.js包含此代码，server.js包含此代码等等，以便至less有东西显示在我的网页上。到目前为止，我有这样的： // in my app.js var express = require('express'), app = express(); app.use(express.static('public')); app.get('/hashtag/:hashtag', function(req, res) { var token = (removed); // this is where id fetch instagram imgs }); var server = app.listen(3000, function () { var host = server.address().address; var port = server.address().port; […]

Uncaught TypeError在ES6中使用React Router呈现<Router>：type.toUpperCase不是函数: 我最近升级到了React v。0.14.0，ReactDOM v。0.14.0和React Router v。1.0.0-rc3，我正在努力处理以下错误。我已经阅读并尝试了这个和这篇文章的解决scheme，但我不能让它为我的代码，它使用ES6工作。调用ReactDOM.render方法时，发生在我的客户端app.js的错误。 import React from 'react'; import ReactDOM from 'react-dom'; import Router from 'react-router'; import routes from './routes'; import createBrowserHistory from 'history/lib/createBrowserHistory'; let app = document.getElementById('app'); let history = createBrowserHistory(); ReactDOM.render(<Router routes={routes} history={history} />, app); 这是从我的routes.js 。 import React from 'react'; import {Route, IndexRoute} from 'react-router'; import App from './components/App'; […]

Sails-React：接收编程redirect的数据: 我正在开发一个使用Sails和React的Web应用程序。在这里，我正在注册用户，并将它们redirect到主页传递id作为参数。所以在redirect之后， UserController's会被调用。这里是代码'api / controller / UserController' home : function(req,res){ var userId = parseInt(req.params.id); sails.log.warn('Home req.params.id :: ',userId); if(userId && typeof userId === "number"){ User.findOne(userId) .then(function(user){ sails.log.info('Sending user [home]:: ',user); Router.run(routes, '/user/home/' + userId, function(Root){ return res.view("homepage",{ 'body' : React.renderToString(<Root/>), 'user' : user }); }); }).catch(function(err){ sails.log.error('Error while finding user :: ',err); return […]

反应没有在客户端代码插入跨度？: 首先，我是新的反应，最近我通过推文直播stream本教程。长话短说，我想添加一个链接到他们的文本之后的每条推文。为此，我只是将道具添加到包含url和用户名的推文项目中。当我查看网站时，链接在那里，然后立即消失。在控制台中，我收到了一个警告：“React试图在容器中重用标记，但是校验和是无效的，这通常意味着你正在使用服务器渲染，而服务器上生成的标记并不是客户期望的。注入新的标记来补偿哪些工作，但是你已经失去了服务器渲染的许多好处，而是要弄清楚为什么在客户端或服务器上生成的标记是不同的“ 这里错误的原因是服务器将列表项目呈现为<li react id…> <span react-id …> ，而客户端呈现为<li react-id …> Text here with no span tag </li> 为什么客户端没有在一个范围内包装列表项内容，因为反应是应该做的。如果重要的话，文本被插入为prop {this.props.text} 。我可以提供一些代码，但是我不确定会有什么帮助，这些都是非常基本的。 tweet item render（）返回如下： return ( <li className="list-group-item">{this.props.text}<a href={this.props.url}>{this.props.user}</a></li> ); 服务器渲染如下（nodejs / express）： var markup = React.renderToString(Tweets({ data: tweet_list.reverse() })); console.log(markup); res.render('index', { markup: markup, state: JSON.stringify(tweet_list) }); 编辑 […]

为什么用“ – ”（短划线）给Babelify上的“Gulp”给出“意外的标记错误”？: 我正在使用Browserify和Babelify设置（或实际上修改现有的）项目。出于某种原因，我无法正确configuration我的gulp文件。如果问题很重要的话，这个项目本身就是一个React项目。我摆脱了大部分问题，但是现在我在Browserify上收到了“意外的令牌”错误。它是由React组件或带有属性名称的html元素引起的。下列： <button type="button" data-toggle="collapse"> 我的Browserify任务： gulp.task('browserify', function() { browserify('./src/js/main.js') .transform(babelify.configure({ presets: ["react", "es2015"] })) .bundle() .on('error', function(err){ process.stdout.write('' + err + '\n'); notifier.notify({ title: 'Error', message: err, sound: true, wait: true }, function (err, response) { }); }) .pipe(source('main.js')) .pipe(gulp.dest('dist/js')) .pipe(connect.reload()); }); 的package.json： { "name": "srcd-mockup", "version": "1.0.0", "description": "", […]