Gulpfile problems - npm

enter image description here
enter image description here
I got some problems with my gulpfile. it does`t compile my sass files into css an i have an error (
`Error in plugin "gulp-sass"
Message:
gulp-sass 5 does not have a default Sass compiler; please set one yourself.
Both the `sass` and `node-sass` packages are permitted.
For example, in your gulpfile:
var sass = require('gulp-sass')(require('sass'));
The following tasks did not complete: watch, style
Did you forget to signal async completion?`
) when i try to run it. Browser sync works well enough but i cant compile. I have all modules i need (
"devDependencies": {
"browser-sync": "^2.27.4",
"gulp": "^4.0.2",
"gulp-sass": "^5.0.0"
).

Related

Solana Test Program Anchor Test failing tsconfig.json" > needs an import assertion of type "json"

I ran anchor test --skip-deploy and all it should do is initialize my program, but all I get is this error, that I cannot resolve. I checked the tsconfig.json settings they should be fine. This is just the default anchor setup and I'm not importing any unusual JSON files anywhere.
anchor test --skip-deploy BPF SDK:
/Users/julia/.local/share/solana/install/releases/1.9.5/solana-release/bin/sdk/bpf
cargo-build-bpf child: rustup toolchain list -v cargo-build-bpf child:
cargo +bpf build --target bpfel-unknown-unknown --release warning:
unused variable: ctx --> programs/feeRedeemCounter/src/lib.rs:8:23
| 8 | pub fn initialize(ctx: Context) -> ProgramResult
{ | ^^^ help: if this is intentional, prefix
it with an underscore: _ctx | = note:
#[warn(unused_variables)] on by default
warning: feeRedeemCounter (lib) generated 1 warning
Finished release [optimized] target(s) in 1.28s cargo-build-bpf child:
/Users/julia/.local/share/solana/install/releases/1.9.5/solana-release/bin/sdk/bpf/dependencies/bpf-tools/llvm/bin/llvm-readelf
--dyn-symbols /Users/julia/Downloads/anchorTutorial/feeRedeemCounter/target/deploy/fee_redeem_counter.so
To deploy this program: $ solana program deploy
/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/target/deploy/fee_redeem_counter.so
The program address will default to this keypair (override with
--program-id): /Users/julia/Downloads/anchorTutorial/feeRedeemCounter/target/deploy/fee_redeem_counter-keypair.json
yarn run v1.22.17 warning package.json: No license field $
/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/.bin/ts-mocha
-p ./tsconfig.json -t 1000000 'tests/**/*.ts'
TypeError: Module
"file:///Users/julia/Downloads/anchorTutorial/feeRedeemCounter/tsconfig.json"
needs an import assertion of type "json"
at new NodeError (node:internal/errors:371:5)
at validateAssertions (node:internal/modules/esm/assert:82:15)
at defaultLoad (node:internal/modules/esm/load:24:3)
at ESMLoader.load (node:internal/modules/esm/loader:359:26)
at ESMLoader.moduleProvider (node:internal/modules/esm/loader:280:58)
at new ModuleJob (node:internal/modules/esm/module_job:66:26)
at ESMLoader.#createModuleJob (node:internal/modules/esm/loader:297:17)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:261:34)
at async Promise.all (index 0)
at ESMLoader.import (node:internal/modules/esm/loader:337:24)
at importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
at formattedImport (/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/mocha/lib/nodejs/esm-utils.js:7:14)
at Object.exports.requireOrImport (/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/mocha/lib/nodejs/esm-utils.js:48:32)
at Object.exports.loadFilesAsync (/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/mocha/lib/nodejs/esm-utils.js:103:20)
at singleRun (/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/mocha/lib/cli/run-helpers.js:125:3)
at Object.exports.handler (/Users/julia/Downloads/anchorTutorial/feeRedeemCounter/node_modules/mocha/lib/cli/run.js:374:5)
error Command failed with exit code 1. info Visit
https://yarnpkg.com/en/docs/cli/run for documentation about this
command. Error: Program address not found.
I fixed my own problem by running
yarn add ts-mocha
yarn add ts-mocha
This did not work for me. I deleted the package-lock.json and then updated the npm packages to the latest
"devDependencies": {
"#types/chai": "^4.3.4",
"#types/mocha": "^10.0.1",
"#types/node": "^18.11.18",
"chai": "^4.3.7",
"mocha": "^10.2.0",
"ts-mocha": "^10.0.0",
"typescript": "^4.9.5"
then updated the provider code:
import * as anchor from "#project-serum/anchor";
const provider = anchor.AnchorProvider.env();
anchor.setProvider(provider);

how to resolve this firebase module versioning error?

Here's a list of my firebase dependencies in package.json:
"#react-native-firebase/admob": "^6.2.0",
"#react-native-firebase/app": "^6.2.0",
"#react-native-firebase/auth": "^6.2.0",
"#react-native-firebase/crashlytics": "^6.2.0",
"#react-native-firebase/messaging": "^6.2.0",
I just added the last "messaging" dependency in that list and then ran npm install. I included the following import for a component:
import messaging from '#react-native-firebase/messaging';
Then I included the following line of code in one of the component functions:
const enabled = await firebase.messaging().hasPermission();
My app is currently returning the following error:
Error: Requiring module "node_modules\#react-native-firebase\messaging\lib\index.js", which threw an exception: Error: You've attempted to require '#react-native-firebase\messaging' version '6.3.4', however, the '#react-native-firebase\app' module is of a different version (6.2.0). All React Native Firebase modules must be of the same version. Please ensure they match up in your package.json file and re-run yarn/npm install
I inspected my project's node_modules\#react-native-firebase\messaging\package.json. Here's a subset of some of the version refs within that file:
"_from": "#react-native-firebase/messaging#^6.2.0",
"_id": "#react-native-firebase/messaging#6.3.4",
"_requested": {
"raw": "#react-native-firebase/messaging#^6.2.0",
"rawSpec": "^6.2.0",
"fetchSpec": "^6.2.0"
},
"_resolved": "https://registry.npmjs.org/#react-native-firebase/messaging/-/messaging-6.3.4.tgz",
"_spec": "#react-native-firebase/messaging#^6.2.0",
"version": "6.3.4"
So it looks like the ^6.2.0 version spec that I configured is getting read as expected, but then some aspect of the npm install process redirects the install to version 6.3.4. Any idea why this is happening? All of the firebase modules are required to be of the same version, so if I want to use the firebase messaging module then do I need to set the version to all of the other firebase modules to "^6.3.0" in my project's package.json? Or do I have other options for a workaround?

Bootstrap-vue components not imported when importing an npm package from local

Okay so maybe this has a fairly simple explanation which I don't know how to look up, but here's my conundrum:
if I publish my project (my-navigation) to the npm registry and then npm install it in another project (my-vue-app), it works all great, but!
if I try to npm install my-navigation directly from its folder on my machine into my-vue-app, I start getting runtime errors indicating that I have not correctly registered some bootstrap-vue components
I have even tried copying the files under node_modules/my-navigation into a folder and then npm installing that - I get the same errors
This is my main entrypoint:
import Vue from "vue";
import MyNavigation from "./MyNav.vue";
import {
BNavbar,
BNavbarBrand,
BNavbarNav,
BDropdownForm
} from "bootstrap-vue";
Vue.component("b-navbar", BNavbar);
Vue.component("b-navbar-brand", BNavbarBrand);
Vue.component("b-navbar-nav", BNavbarNav);
Vue.component("b-dropdown-form", BDropdownForm);
Vue.component("b-form-radio", BFormRadio);
import "./styles/bootstrap/mystyles.scss";
export default {
install(Vue) {
Vue.component('my-navigation', MyNavigation);
},
};
export { MyNavigation };
and in package.json:
"main": "./dist/my-navigation.umd.js",
"module": "./dist/my-navigation.esm.js",
"unpkg": "./dist/my-navigation.min.js",
"files": [
"dist/*"
],
"dependencies": {
"core-js": "^3.3.2",
"vue": "^2.6.10"
},
"peerDependencies": {
"bootstrap-vue": "^2.0.4"
},
"scripts": {
"build-bundle": "vue-cli-service build --target lib --name my-navigation ./src/main-navbar.js"
},
I can of course work around this by importing the components directly in MyNavigation.vue, but I want to register them globally for use in another component I'll be including in the npm package as well; and well it just seems weird to me that it works through the registry but not locally
Edit: it appears that through the registry, the bootstrap-vue components are being registered globally and are available then in my-vue-app by importing the npm package. This seems like a bad idea(?), so I probably don't want that anyway.
npm pack produces a .tgz file https://docs.npmjs.com/cli/pack.html
Importing from this file instead of from dist has the same behaviour as importing from a package on the registry.
Still not sure why or what npm does in creating this file, but that answers at least the question of how to mimic the behaviour of a registered package when importing from local/a repository.

react-native-svg not resolved | victory-native

I am trying to work with victory-native package for graph for react-native platform. I have installed both victory-native and react-native-svg with --save command. And then I also linked them with
react-native link but now when I do react-native start it throws the following error:
error: bundling failed: Error: While trying to resolve module `react-native-
svg` from file `/Users/keshav/projects/PropertyFinder/node_modules/victory-
native/lib/components/victory-primitives/line.js`, the package
`/Users/keshav/projects/PropertyFinder/node_modules/react-native-svg/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved
(`/Users/keshav/projects/PropertyFinder/node_modules/react-native-svg/index.js`. Indeed, none of these files exist:
* `/Users/keshav/projects/PropertyFinder/node_modules/react-native-svg/index.js(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`
* `/Users/keshav/projects/PropertyFinder/node_modules/react-native-svg/index.js/index(.native||.android.js|.native.js|.js|.android.json|.native.json|.json)`
at ResolutionRequest.resolveDependency
(/Users/keshav/projects/PropertyFinder/node_modules/metro/src/node-
haste/DependencyGraph/ResolutionRequest.js:104:15)
```
My package.json:
"react": "16.3.0-alpha.2",
"react-native": "0.54.2",
"react-native-svg": "^6.3.0",
"react-navigation": "^1.5.7",
"simple-swizzle": "^0.2.2",
"superagent": "^3.8.2",
"victory-native": "^0.17.2"
What is wrong here?
I met the same problem.But the different is i used the 'react-native-tab-navigator'.I've tried many times with different ways until i restarted Xcode and rebuilt the project.I hope this can help you.
Late to the party, but I had to modify my metro.config.js file as follows:
module.exports = {
...
resolver: {
sourceExts: ['js', 'jsx', 'ts', 'tsx']
}
}
I think this is to help metro resolve paths beyond js, jsx, etc.

Integrating Relay with React native

I want to integrate relay with react native.
I am getting following error:
getBabelRelayPlugin is not defined while processing preset
I used following steps to integrate react native with relay
1.Back up your project.
2. Make sure you have your GraphQL server ready and your schema.json at hand too. For more details about the latter two visit the React-Relay project page.
Ensure that you’re using npm version 3 or greater.
3.If React Native's packager (react-native start) is running somewhere in the background, you should stop it now.
4.Run: watchman watch-del-all
5.Delete the ./node_modules directory from your project.
6.Edit your package.json file, make sure it has the following:
"dependencies": {
"react": "^0.14.7",
"react-native": "facebook/react-native",
"react-relay": "^0.7.3"
},
"devDependencies": {
"babel-core": "^6.6.4",
"babel-preset-react-native": "^1.4.0",
"babel-relay-plugin": "^0.7.3"
}
Babel version is especially important. Make sure that your project uses babel 6.5 or later, we need it for the passPerPreset feature in .babelrc file.
7.Create a new file .babelrc and place it in your project's directory:
{
"presets": [
"./scripts/babelRelayPlugin",
"react-native"
],
"passPerPreset": true
}
8.Create a new file in your project's directory called babelRelayPlugin.js with the following content:
const getBabelRelayPlugin = require('babel-relay-plugin');
const schema = require('./schema.json');
module.exports = { plugins: [getBabelRelayPlugin(schema.data)] };
9Copy your schema.json file to the project's directory too.
10.Run: npm install