javascript 在反应原生中需要模块
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33143147/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Requiring Modules in react-native
提问by vanBrunneren
I'm stuck on a problem in a react-native project. I'm trying to do a general require file, where I export all my modules. After that I would like to require only my "require.js" file to avoid calls like this require('../../ModuleName') in every file.
我在本机反应项目中遇到了一个问题。我正在尝试创建一个通用的 require 文件，在其中导出所有模块。之后，我只想要求我的“require.js”文件，以避免在每个文件中调用这样的 require('../../ModuleName') 。
I have 4 files:
我有4个文件：
index.ios.js
/app/home.js
/app/MyView.js
/app/require.js
require.js:
需要.js：
module.exports = {
Home: require('./home'),
MyView: require('./MyView')
}
in index.ios.js (he modules Home and MyView are getting importet correctly)
在 index.ios.js 中（他的模块 Home 和 MyView 正在正确导入）
'use strict';
var React = require('react-native');
var {
AppRegistry,
StyleSheet,
Text,
View,
} = React;
var {
Home,
MyView
} = require('./app/require');
class Test_require extends React.Component {
render() {
return(
<Home />
);
}
}
AppRegistry.registerComponent('Test_require', () => Test_require);
Home.js (the module MyView is not getting importet)
Home.js（模块 MyView 没有导入）
'use strict';
var React = require('react-native');
var {
View,
Text
} = React;
var {
MyView
} = require('./require');
class Home extends React.Component {
render() {
console.log(MyView);
return(
<MyView />
);
}
}
module.exports = Home;
In the Home.js the MyView variable is "undefined". If I want to require a module in a Module, that gets already imported in another file, the variable is undefined.
在 Home.js 中，MyView 变量是“未定义的”。如果我想在模块中需要一个模块，该模块已经导入到另一个文件中，则该变量未定义。
Do you guys have any clue why I can do this or is there a better solution for my problem? Thanks for any clue
你们知道为什么我可以这样做还是有更好的解决方案来解决我的问题？感谢您提供任何线索
回答by vanBrunneren
So I'm posting my own answer in case someone else has the same problem.
所以我发布我自己的答案，以防其他人遇到同样的问题。
In a syntax like this the required files are getting loaded synchronously. So if the component's build is faster than requiring files, this problem happens. Either make your components load lazy when you need them or use es6 import syntax like this (import loads asynchronously):
在这样的语法中，所需的文件正在同步加载。因此，如果组件的构建速度比需要的文件快，就会发生这个问题。要么在你需要的时候让你的组件延迟加载，要么使用像这样的 es6 导入语法（导入加载异步）：
import React from 'react-native'
cheers!
干杯！
回答by Nick Allen
Add @providesModule moduleNamein your file header comment. And you can import using require('moduleName') other place in your project.
See this issue.
BTW, how come that such a amazing feature never documented anywhere ?
添加@providesModule moduleName您的文件标题注释。您可以在项目中的其他地方使用 require('moduleName') 导入。
看到这个问题。
顺便说一句，这么神奇的功能怎么从来没有在任何地方记录过？
回答by ChiralMichael
This is way old, but the record needs to be corrected. Require isn't async. You can tell this easily by inspecting the object returned (not a promise).
这已经很老了，但记录需要更正。要求不是异步的。您可以通过检查返回的对象（不是承诺）来轻松判断这一点。
Re-exporting in ES6 is simple.
在 ES6 中重新导出很简单。
For example:
例如：
export * from './types';
export { default as ApiClient } from './ApiClient';
