我正在从 react-native 中找到模块 `./index.css` [英] I am getting The module `./index.css` could not be found From react-native
问题描述
我得到模块 ./index.css
无法从 react-native 中找到,
I am getting The module ./index.css
could not be found From react-native,
我已在该位置正确导入文件.在谷歌上搜索了很多,请帮忙.
I have imported the file correctly on the location. Searched a lot on the google , please help.
这是错误的完整输出,
Body:
{"originModulePath":"/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js","targetModuleName":"./index.css","message":"Unable to resolve module `./index.css` from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`: The module `./index.css` could not be found from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`. Indeed, none of these files exist:\n\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`","errors":[{"description":"Unable to resolve module `./index.css` from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`: The module `./index.css` could not be found from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`. Indeed, none of these files exist:\n\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`"}],"name":"Error","stack":"Error: Unable to resolve module `./index.css` from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`: The module `./index.css` could not be found from `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.js`. Indeed, none of these files exist:\n\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`\n * `/Users/tejas-mac/Documents/React Studio/Exported Projects/index.css/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`\n at ModuleResolver.resolveDependency (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:161:851)\n at ResolutionRequest.resolveDependency (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:91:16)\n at DependencyGraph.resolveDependency (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/node-haste/DependencyGraph.js:272:4579)\n at dependencies.map.relativePath (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/DeltaBundler/traverseDependencies.js:376:19)\n at Array.map (<anonymous>)\n at resolveDependencies (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/DeltaBundler/traverseDependencies.js:374:16)\n at /Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/DeltaBundler/traverseDependencies.js:212:33\n at Generator.next (<anonymous>)\n at step (/Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:313)\n at /Users/tejas-mac/Documents/React Studio/Exported Projects/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:473"}
processBundleResult
BundleDownloader.java:266
access$200
BundleDownloader.java:35
onResponse
BundleDownloader.java:153
execute
RealCall.java:135
run
NamedRunnable.java:32
runWorker
ThreadPoolExecutor.java:1133
run
ThreadPoolExecutor.java:607
run
Thread.java:761
推荐答案
根据 React Native 文档:
According to the React Native Documentation:
您不使用特殊语言或语法来定义样式.您只需使用 JavaScript 设计您的应用程序.所有核心组件都接受一个名为 style 的道具.样式名称和值通常与 CSS 在 Web 上的工作方式相匹配,但名称使用驼峰式大小写,例如 backgroundColor
而不是 background-color
.
You don't use a special language or syntax for defining styles. You just style your application using JavaScript. All of the core components accept a prop named style. The style names and values usually match how CSS works on the web, except names are written using camel casing, e.g backgroundColor
rather than background-color
.
style
属性可以是一个普通的旧 JavaScript 对象.
The style
prop can be a plain old JavaScript object.
随着组件越来越复杂,使用 StyleSheet.create
在一个地方定义多个样式通常会更简洁.举个例子:
As a component grows in complexity, it is often cleaner to use StyleSheet.create
to define several styles in one place. Here's an example:
import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default class LotsOfStyles extends Component {
render() {
return (
<View>
<Text style={styles.red}>just red</Text>
<Text style={styles.bigblue}>just bigblue</Text>
<Text style={[styles.bigblue, styles.red]}>bigblue, then red</Text>
<Text style={[styles.red, styles.bigblue]}>red, then bigblue</Text>
</View>
);
}
}
const styles = StyleSheet.create({
bigblue: {
color: 'blue',
fontWeight: 'bold',
fontSize: 30,
},
red: {
color: 'red',
},
});
当然,样式不需要与组件在同一个文件中.您可以将它们抽象到一个单独的文件中,然后简单地从那里导出它们并在需要的地方导入.
And of course, the styles do not need to be in the same file as the component. You can abstract them to a separate file and then simply export them from there and import where needed.
这篇关于我正在从 react-native 中找到模块 `./index.css`的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!