We have a public react-native package with some native components inside a sub directory in the same repo /lib, these native components are also being published.
We need to do some refactoring (internal reasons) and I wonder if it's possible to use a different version in our devDependencies and dependencies? Something like this:
* From what I've tested this gives me the public version locally as well.

dependencies": {
  "native-lib": "^1.0.0"
},
devDependencies": {
  "native-lib": "file:./lib"
},

So our users will get the public version while we can work with the local version while developing?

We have a public react-native package with some native components inside a sub directory in the same repo /lib, these native components are also being published.
We need to do some refactoring (internal reasons) and I wonder if it's possible to use a different version in our devDependencies and dependencies? Something like this:
* From what I've tested this gives me the public version locally as well.

dependencies": {
  "native-lib": "^1.0.0"
},
devDependencies": {
  "native-lib": "file:./lib"
},

So our users will get the public version while we can work with the local version while developing?

• react-native
• package.json

Share Improve this question Follow asked Nov 18, 2024 at 10:36 MikeLMikeL 2,91422 gold badges2727 silver badges4242 bronze badges

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 0

I do not think it is. Both packages would land in the same folder in node_modules. That should lead to conflict.

But you could perhaps try to install your development version under (slightly) different name?

And then, even if you avoid conflict on a package-manager level, you must reference your dev version differently in your application.

A common approach is to use scripts in your package.json file to install different versions of packages depending on the environment. You can create scripts that install separate dependencies for development and production.

{
  "name": "my-project",
  "version": "1.0.0",
  "description": "A sample project to demonstrate package.json scripts",
  "scripts": {
    "install:dev": "npm install --only=development",
    "install:prod": "npm install --only=production",
    "install": "npm install",
    "build": "webpack --mode production",
    "dev": "webpack serve --mode development",
    "start": "NODE_ENV=production node server.js",
    "lint": "eslint src/**/*.js",
    "test": "jest"
  },
  "dependencies": {
    "express": "^4.17.1",
    "react": "^18.0.0"
  },
  "devDependencies": {
    "webpack": "^5.0.0",
    "babel-loader": "^8.0.0",
    "eslint": "^8.0.0",
    "jest": "^28.0.0"
  },
  "engines": {
    "node": ">=12.0.0"
  }
}

Install Scripts:

"install:dev": Installs only the development dependencies (such as webpack, eslint, etc.). Use this when you're in a development environment. "install:prod": Installs only the production dependencies (like express and react), ignoring development dependencies. "install": The default installation command that installs both production and development dependencies.

uild and Development Scripts:

"build": A script to build your project for production using webpack in production mode. This would typically include bundling your JavaScript, optimizing assets, etc. "dev": Runs the development server using webpack in development mode. This is useful for local development and includes features like hot module reloading. Start Script:

"start": Runs the application in a production environment by setting the NODE_ENV=production environment variable and then starting the application with node server.js. This would typically be the command you'd run in a production environment after deployment. Linting and Testing:

"lint": Runs eslint on all JavaScript files in the src directory. You would use this to ensure your code adheres to your linting rules. "test": Runs your tests using Jest. This is useful for running unit tests and other automated tests in your project. Install Dependencies for Development:

bash

npm run install:dev

This installs only the development dependencies.

Install Dependencies for Production:

bash

npm run install:prod

Example Flow To set up a project for development, you would typically do something like this:

Clone or create your project. Run npm run install:dev to install all development dependencies. Run npm run dev to start the local development server and begin working on your code. When you're ready to deploy to production, run npm run build to create the production build and then run npm start to launch your app in a production environment.