在 React Native + Node 之间共享代码

2024-01-25

我正在使用 React Native 和 Node.js。我想在两者之间共享代码。我的文件夹结构是这样的。

myreactnativeapp/
mynodeserver/
myshared/

在反应本机和节点应用程序中,我已经包含了 包.json

"dpendencies" : {
    "myshared": "git+https://myrepository/ugoshared.git"
}

然后可以通过 require/import 等将其包含在每个项目中。这一切都运行良好,对于生产我很满意。 (虽然我很想知道更好的方法?)

我面临的问题是开发速度非常慢。

填充更改的步骤是:

  1. 在共享中进行更改
  2. 将更改提交到 git
  3. 更新 npm 模块

在开发过程中,我真的希望使用相同的代码库,而不是这个漫长的更新过程。我尝试了以下方法:

  1. 在node_modules/shared中添加符号链接 - 在react-native包管理器中不起作用
  2. 使用相对路径 ../../../shared - 在react-native包管理器中不起作用

还有其他想法吗?

Update 1

我创建了一个 script.sh,在包管理器启动之前运行该脚本将文件复制到本地目录中。这并不理想,但至少我只需要重新启动打包器,而不是搞乱 git 等。

#myreactnativeapp/start.sh    
SOURCE=../myshared
MODULE=myshared

rm -rf ./$MODULE
mkdir ./$MODULE

find $SOURCE -maxdepth 1 -name \*.js -exec cp -v {} "./$MODULE/" \;

# create the package.json
echo '{ "name": "'$MODULE'" }' > ./$MODULE/package.json

# start the packager
node node_modules/react-native/local-cli/cli.js start

然后在我的 package.json 中我将脚本更新为

  "scripts": {
    "start": "./start.sh",
  },

所以,流程就是现在。

  1. 做出改变
  2. 启动/重新启动打包器
  3. Automatic:
    • 脚本复制 myshared/ -> myreactnativeapp/myshared/ 下的所有 .js 文件
    • 脚本使用模块名称创建 package.json

因为我已将 package.json 添加到具有模块名称的复制文件中,所以在我的项目中,我可以只包含这些项目,就像通过上面的包管理器包含该模块一样。理论上,当我切换到在生产中使用该包时,我不需要更改任何内容。

Import MyModule from 'myshared/MyModule'

Update 2

我的第一个想法总是令人厌烦地重新启动包管理器。相反,我在共享目录中创建了一个小节点脚本来监视更改。每当有更改时,它都会将其复制到 React Native 工作目录。

var watch = require('node-watch')
var fs = require('fs')
var path = require('path')

let targetPath = '../reactnativeapp/myshared/'
watch('.', { recursive: false, filter: /\.js$/ }, function(evt, name) {

  console.log('File changed: '+name+path.basename(__filename))

  // don't copy this file
  if(path.basename(__filename) === name) {
    return
  }

  console.log(`Copying file: ${name} --> ${targetPath+name}`);

  fs.copyFile(name, targetPath+name, err => {

    if(err) {
      console.log('Error:', err)
      return;
    }

    console.log('Success');
  })
});

console.log(`Starting to watch: ${__dirname}. All files to be copied to: ${targetPath}`)

None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 React Native + Node 之间共享代码 的相关文章

随机推荐