如何将javascript变量/对象从一个文件复制到另一个文件

Question

我正在尝试将文件中的CSS从代码中分离出来，并在我的react原生项目中为CSS创建单独的文件。我想把styles变量放在另一个文件中，而不是放在同一个文件中组件.style.js文件并从那里导入。你知道吗

import React, {Component} from 'react';
import {StyleSheet, View} from 'react-native' 

export default class Component extends React.Component{
    render(){
        {some component}
    }
}

const styles = StyleSheet.create({
    container:{
        flex:1,
        justifyContent: 'center',
        alignItems:"center",
        backgroundColor:'red'
    },
    block:{
        backgroundColor:'green',
        height:200,
        width:200,
        alignItems:'center',
        justifyContent:'center'
    }
});

问题是项目有太多的组件，无法手动完成。我想以某种方式使这项任务自动化。对于任何文件abc.js公司，我要创建abc.style.js公司，从该文件中剪切样式变量，并将其粘贴到abc.styles.js公司然后导入abc.js公司你知道吗

有没有办法用python自动化整个创建、复制和导入过程，节点.js或者其他图书馆？你知道吗

我更喜欢使用一种比暴力方法更好的方法，比如用python读取文件，获取开始点和结束点，复制字符串，粘贴它。有没有一种简单、高效、快捷的方法？你知道吗

Answer 1

可以创建与文件匹配的样式文件。你知道吗

示例样式.js

import { Dimensions, Platform } from "react-native";

const windowHeight = Dimensions.get("window").height;
const windoWidth = Dimensions.get("window").width;

export default {
  container: {
    backgroundColor: "#fff",
    height: Platform.OS === "ios" ? windowHeight : undefined,
    width: Platform.OS === "ios" ? windoWidth : undefined,
  }
...

示例用法

import styles from "./styles.js";
...
<View style={styles.container}>