Failed to compile.
/Users/mohdjabiuddin/MNCL.DEV/MY-PROJECTS/renter-graphql/app/node_modules/react-native/Libraries/Network/XMLHttpRequest.js
Module not found: Can't resolve './RCTNetworking' in '/Users/jabiuddin/MNCL.DEV/MY-PROJECTS/renter-graphql/app/node_modules/react-native/Libraries/Network'
You probably have a problem with reactotron, I had the same problem with Ignite boilderplate from Infinite Red.
If so, you should install reactotron version for web.
Fast solution
Install reactotron-react-js and import it instead of reactotron-react-native:
yarn add -D reactotron-react-js
// import Tron from "reactotron-react-native"
import Tron from "reactotron-react-js"
Long term solution
Install reactotron-react-js:
yarn add -D reactotron-react-js
Add separate configuration for web and native
// reactotron.native.ts
import Tron from "reactotron-react-native"
...
// reactotron.web.ts
import Tron from "reactotron-react-js"
...
Thanks to metro bundle this configuration will be loaded depend on environment. Maybe you have to comment some other configuration (depends on Ignite version).
Related
I want to implement DESO into my app. The most convenient way is probably the DESO library from their developer hub.
I want to be as precise as possible here. So first I downloaded the deso-protocol npm package. In the readme of this library is stated that it is generated with nx. So I downloaded that too. No big issues. And I should: Run nx build deso-protocol to build the library.(in readme). Than I get an error that there is no workspace, when I want to create one with "npx create-nx-workspace deso-protocol --preset=core" , nx gets stuck in that process.
So I decided to do it without the building(I don't quite now if that is needed, am new to npm) and just do it with the classic js imports.
The "import Deso from 'deso-protocol';" from the docs isn't working. Because the module imports have to start with "/" or "./" or sth. similar etc.
So I tried import Deso from './node_modules/deso-protocol/src/index.js';. That's not working. Error:
Uncaught SyntaxError: import not found: default
using import { Deso } from './node_modules/deso-protocol/src/index.js'; doesn't work either because then Deso isn't found. I don't quite now what to do now.
Edit
I use plain JavaScript. deso-protocol uses plain JavaScript too, I hope. There isn't much code yet:
Index.js file:
import Deso from './node_modules/deso-protocol/src/index.js';
test.html file:
<script type="module" src="index.js"></script>
That's it. I use http.server from Python to host the local server.
Just install deso-protocol library from https://www.npmjs.com/package/deso-protocol with npm i deso-protocol
In your app import it as usual
import Deso from "deso-protocol";
And initialize
const deso = new Deso();
Readme file is really confusing, I have no idea what
Run nx build deso-protocol to build the library.
is supposed to mean, it works without that no problem.
tried running tests with vitest and it can seem to resolve dependencies from $lib/* and $app/* this is the error, Failed to resolve import "$lib/stores/store" from "src/lib/components/Hello.svelte". Does the file exist? here is the link to the playground https://gitlab.com/paulwvnjohi/hello-vitest
It seems Vitest is NOT automatically picking up your Vite config, since it's "hidden" in svelte.config.js and I'm sure there's tons of magic stuff SvelteKit adds, such as the resolve.alias paths for things like the $lib and $app imports to work.
I don't know if Vitest core would do something automatically in the future, but now there's the vitest-svelte-kit package you can use: https://github.com/nickbreaton/vitest-svelte-kit
Install the package:
npm i -D vitest-svelte-kit
Create a file vitest.config.js and put inside the method that magically extracts the correct vite config for you, according to your settings in svelte.config.js:
// vitest.config.js
import { extractFromSvelteConfig } from "vitest-svelte-kit"
export default extractFromSvelteConfig()
Worked for me!
I'm running a SvelteKit application with the Animate on Scroll (aos) module. This worked like a charm but due to the nature of my project, I needed to modify a few lines in the module, so I pulled the project from GitHub, modified it, rebuilt it and imported it via a local dependency:
"dependencies": {
"aos": "file:/path/to/aos"
}
Whenever I try to import the module now however: import AOS from 'aos';, I get this error message:
Uncaught (in promise) SyntaxError: The requested module '/#fs/C:/path/to/aos/dist/aos.js' does not provide an export named 'default'
Note that this also happens when I pull the repository and try to import it locally without changing it. Why does this happen and how can I fix it?
I trying to run expo-cli in browser mode.
But there is the error:
Module not found: Can't resolve '../../Utilities/Platform' in
'.../node_modules/react-native/Libraries/Core/Timers'.
I tried also to look manually for this module but no luck.
What can I do to make expo client works in web browsers?
Using a module resolver plugin to resolve dependencies to the React Native Web exports might help you. React-native-viewpager has an issue with resolving relative paths. See this comment and this entire thread: https://github.com/expo/web-examples/issues/73#issuecomment-621078860 and sample repo here: https://github.com/ricardoribas/expo-react-native-web
You can also config your webpack. You can use 'expo customize:web'. This will install #expo/webpack-config as development dependency an create a webpack.config.js.
You can define aliases on this configuration like this:
const createExpoWebpackConfigAsync = require('#expo/webpack-config')
module.exports = async function (env, argv) {
const config = await createExpoWebpackConfigAsync(env, argv)
config.resolve.alias['../Utilities/Platform'] =
'react-native-web/dist/exports/Platform'
return config
}
This should resolve your issue
As for me, If you experience this error and you have done re-install on your packages and the error still remain, Now check all your import, there must be something your are suppose to import form react-native that you are importing from somewhere else if you can find this this error will be fixed what you can do is to identify the actual wrong import
For me I do:
import Pressable from "reactnative/Libraries/Components/Pressable/Pressable
Instead of:
import {Pressable } from "react-native";
I cloned an existant Vuejs project and made a "npm install".
Everything installed well except "moment" and maybe "vue-moment".
i've got this error :
Failed to compile.
./src/main.js
Module not found: Error: Can't resolve 'moment' in '/app/src'
so in installed them with "npm install --save moment vue-moment"
And still got the error.
here some code of my main.js file :
import moment from 'moment'
import VueMoment from 'vue-moment'
// Vue use moment.js
Vue.use(VueMoment, {
moment
});
moment.locale('fr');
the packages are installed and present in the node_modules folder and are present also in the package.log.json and package.json.
The weird things is, when other people clones this project, they don't have the problem. only me...
One (maybe) pist, is when i put my mouse hover the 'moment' (of the import), i see this :
.../node_modules/moment/moment like there is 2 moment folders, but it looks normal in the node_modules folder.
Thanks in advance!
EDIT SOLVED :
The problem was because i started the project with "docker-compose up" and not "npm run serve" on the FRONT. It started but i had this "moment" problem. Now it works well with the good console code to start the project ...
You cannot use the import function with moment.js since exports is not defined for that module. So you have to use require. You can do this :
Vue.use(require('vue-moment'));
If you really want to use moment.js using import you can do this as well.
import * as moment from 'moment';
Reference: https://www.npmjs.com/package/vue-moment
https://momentjs.com/docs/
Webpack / typescript require works but import doesn't