Comments (10)
Am I understanding you correctly if I say you have a structure that looks something like:
root
├── app1
│ ├── <.js files>
│ └── package.json
├── app2
│ ├── <.js files>
│ └── package.json
└── shared
└── <loose .js files>
Where root
is not a monorepo, and shared
is not a package (i.e. no package.json
)? In that case, could you make shared
a package by adding a package.json
?
The error you're seeing above is because the loose files do not belong to a package, which means that TypeScript can't cache it. I'm not sure of the consequences of adding it to a random root like you've suggested. This will take time to investigate, and it's an edge case I'm not sure we want to support. Adding a package.json
should fix the issue you're seeing. If that doesn't work then we have a bigger issue at hand.
from rnx-kit.
As far as I can tell, each root folder is treated as a project. If a folder contains a tsconfig.json
, it is treated as a TS project and its files will be type-checked by the TypeScript service. Otherwise, the folder is treated as a JS project and will not be type-checked.
cc @afoxman in case I'm mistaken.
from rnx-kit.
Use shared configs: https://www.typescriptlang.org/tsconfig#extends
from rnx-kit.
I did this rough hack to get it to work, just defaulted everything to the current project, since there is only one right now.
function createProjectCache(print) {
const documentRegistry = typescript_1.default.createDocumentRegistry();
const diagnosticWriter = (0, typescript_service_1.createDiagnosticWriter)(print);
// Collection of projects organized by root directory, then by platform.
const projects = {};
function findProjectRoot(sourceFile) {
// Search known root directories to see if the source file is in one of them.
for (const root of Object.keys(projects)) {
---> return root;
if (sourceFile.startsWith(root)) {
return root;
}
Supporting shared modules seems like an important feature, I think this issue should be prioritized.
Thanks 🙏
from rnx-kit.
What does your tsconfig.json
look like? Does it match with how you've configured module-resolver
?
from rnx-kit.
@tido64 Yes the aliases are similar, the proof is that when I added the hack, the build worked correctly. Also the logic that exists in createProjectCache() makes it clear why this fails. You have a file that is outside the root directory which is being compared with the the root directory using .startsWith. That check will always fail.
For info, this issue does not occur with stock Metro bundler.
from rnx-kit.
@tido64 You can validate this issue by creating a very small project that imports a file that is outside the root directory, using a path alias (Configured in both tsconfig.json and babel config)
from rnx-kit.
Example babel configuration
module.exports = {
presets: [ "@rnx-kit/babel-preset-metro-react-native" ],
plugins: [
[
"module-resolver",
{
root: [ "." ],
extensions: [ ".ts", ".tsx", ".json" ],
alias: {
"shared": "../shared"
}
}
]
]
};
Example tsconfig configuration
{
"extends": "@react-native/typescript-config/tsconfig.json",
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"shared/*": [ "../../shared/*" ]
}
},
"include": [
"./src",
"../shared"
],
"exclude": [
"./node_modules"
]
}
from rnx-kit.
I agree with your assessement, though I assumed that it wouldn't be a random root since there is always a single root project, no? in terms of where we start the bundler from.
Either way, thank you 🙏, your suggestion has cleared the error, however will the babel and tsconfig that exist in the root project be used to process shared code as well or will the system try to lookup tsconfig files upstream?
from rnx-kit.
@tido64 I see, what strategy would one have to follow to have the same tsconfig apply to these shared projects, without having to duplicate the file twice?
from rnx-kit.
Related Issues (20)
- @rnx-kit/react-native-auth causes yarn android to fail. HOT 4
- react-native-host: add Windows support
- react-native-host: add macOS support
- create an RFC to discuss the idea of RN based WebAPIs HOT 1
- make a working prototype of a WebAPI to pair with the RFC
- figure out a prioritised list of WebAPIs to work on first post-RFC HOT 3
- improve the rnx-kit CLI generator to have a scope for webapis new packages
- Suggestion: Flag unused imports after inlining platform checks
- Dependency Manager Customizations HOT 1
- Error: Unable to resolve module ./ on bun + babel-plugin-module-resolver + metro-resolver-symlinks HOT 1
- New @rnx-kit/align-deps profil for [email protected]
- 404 Not Found when running npx rnx-align-deps HOT 1
- treeShaking causing a crash with react-native-reanimated HOT 9
- Enable pnpm mode to catch issues earlier
- build faild: No matching export in for import HOT 6
- `bundleRoot` ignored on apple HOT 1
- react-native-host does not render when new arch is enabled HOT 2
- align-deps: add support for grouping log lines on CI
- align-deps: new flag to not throw an error for exact dependencies that are within bounds HOT 6
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from rnx-kit.