Where do i get android package in expo? - reactjs

Cannot find a package similar to "com.test.app" in app.json expo project
"android": {
"config": {
"googleMobileAdsAppId": "ca-app-pub-5011065144052286~3305273933"
}
}

You need to add it yourself in app.json like this:
"ios": {
"bundleIdentifier": "com.test.app"
},
"android": {
"package": "com.test.app",
}
The package and bundleIdentifier can be anything but it needs to be unique on the App Store and Google Play Store

Related

How to Fix Expo App by removing location services

At the moment play store says "Remove the request for location permissions from your app" but I am not using location services anywhere in the app at the moment.
I am already set the "permissions": [] in app.json file.
app.json
"android": {
"package": "com.xxxx",
"versionCode": 1,
"permissions": [],
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#FFFFFF"
}
}
How can I fix this?
Delete node_modules
Delete package-json.lock
Reinstall all: npm install
Source: https://forums.expo.io/t/remove-the-request-for-location-permissions-from-your-app/41488/50

React is not loaded / Build is not generated

I am trying to create a WordPress plugin with React. I am following this link. I have the following package.json file
{
"name": "test-plugin",
"version": "1.0.0",
"private": true,
"description": "Sample plugin for React",
"main": "index.js",
"devDependencies": {
"#wordpress/scripts": "^13.0.3"
},
"scripts": {
"build": "wp-scripts build",
"check-engines": "wp-scripts check-engines",
"check-licenses": "wp-scripts check-licenses",
"lint:css": "wp-scripts lint-style",
"lint:js": "wp-scripts lint-js",
"lint:pkg-json": "wp-scripts lint-pkg-json",
"start": "wp-scripts start",
"test:e2e": "wp-scripts test-e2e",
"test:unit": "wp-scripts test-unit-js"
},
"author": "thor",
"license": "ISC"
}
I am enqueueing the react script as follows
wp_enqueue_script( 'react-script', plugin_dir_url(__DIR__) . 'build/index.js', ['wp-element'], $this->version, false );
ISSUES
The build react js file is not generated. I have followed the above link and everything was installed correctly. But no index.js file is created in build folder
The script is not working if I enqueue src/index.js instead of build/index.js. The script is loaded but not working as expected. I have the div with id my_app in one of the pages in which the script is loaded.
Following is the react script file
const { render, useState } = wp.element;
const Votes = () => {
const [votes, setVotes] = useState(0);
const addVote = () => {
setVotes(votes + 1);
};
return (
<div>
<h2>{votes} Votes test</h2>
<p>
<button onClick={addVote}>Vote!</button>
</p>
</div>
);
};
render(<Votes />, document.getElementById('my_app'));
Had the same problem with you and I spent good couple of hours trying to fix this. Here are problem that I encountered:
One of the issues was the node_modules folder was in the wrong place, supposed to be at the same level as your theme.
The other one was I had to run npm run start instead of npm start. Whenever wp-scripts output something like this :
asset index.js 4.35 KiB [emitted] (name: index)
1 related asset asset index.asset.php 107 bytes [emitted] (name: index)
means it is working. If don't get that means something wrong with your folder location.
Try and let me know.

Detox e2e Test assigned to undefined and all tests skipped

In our react-native project we use detox for e2e test. These were working fine until suddenly we experienced the test suites being assigned to undefined. Weirdly this problem persisted upon reverting any changes to a state where detox was working previously. The problem exists in both, the iOS and Android configurations.
Console error of Detox, assigned to undefined
(This problem is similar to this question, however, as of now detox should work with our react native version.)
My detoxrc.json:
{
"testRunner": "jest",
"runnerConfig": "e2e/config.json",
"configurations": {
"ios": {
"type": "ios.simulator",
"binaryPath": "ios/build/Build/Products/Test-iphonesimulator/Cliniserve One.app",
"build": "xcodebuild -workspace ios/shiftapp.xcworkspace -scheme shiftapp.test -configuration Test -sdk iphonesimulator -derivedDataPath ios/build",
"device": {
"type": "iPhone 11"
}
},
"android": {
"type": "android.emulator",
"binaryPath": "android/app/build/outputs/apk/development/debug/shiftapp_development_debug.apk",
"build": "cd android && ./gradlew assembleDevelopmentDebug assembleDevelopmentDebugAndroidTest -DtestBuildType=debug && cd ..",
"device": {
"avdName": "Pixel_API_29_AOSP"
}
}
}
}
My e2e/config.json
{
"setupFilesAfterEnv" : ["./init.js"],
"testEnvironment": "./environment",
"testRunner": "jest-circus/runner",
"testTimeout": 120000,
"testRegex": "\\.e2e\\.js$",
"reporters": ["detox/runners/jest/streamlineReporter"],
"verbose": true
}
And e2e/environment.js
const {
DetoxCircusEnvironment,
SpecReporter,
WorkerAssignReporter,
} = require('detox/runners/jest-circus');
class CustomDetoxEnvironment extends DetoxCircusEnvironment {
constructor(config) {
super(config);
// Can be safely removed, if you are content with the default value (=300000ms)
this.initTimeout = 300000;
// This takes care of generating status logs on a per-spec basis. By default, Jest only reports at file-level.
// This is strictly optional.
this.registerListeners({
SpecReporter,
WorkerAssignReporter,
});
}
}
module.exports = CustomDetoxEnvironment;
Any help or idea on how to get it to work again would be highly appreciated.

Building a React-Electron app using electron-builder, index.js loads inside pre tags

I have an app that I'm now trying to build to distribute for testing.
I'm using React and Electron with electron-builder to build the app itself. I'm not a web developer so I've been trying to keep things basic and just get something to work.
After about five hours I was finally able to get the app to build somewhat properly and launch, but when it loads index.js (the first page in the app) it displays the source for index.js instead of rendering the content. In the devtools everything is inside a pre tag.
I've already looked at this thread and tried that but it didn't change anything, and I'm not using service workers as far as I can tell.
What the actual Electron window displays after launching with the devtools alongside.
Here's the createWindow function from main.js.
I've tried doing all kinds of things to the pathname with no effect.
function createWindow() {
const startUrl = process.env.ELECTRON_START_URL || url.format({
pathname: path.join(__dirname, '../src/index.js'),
protocol: 'file:',
slashes: true,
});
mainWindow = new BrowserWindow({
width: 800, height: 600, title: "Electron App", webPreferences: {
nodeIntegration: true
}
});
mainWindow.loadURL(startUrl);
mainWindow.on('closed', function () {
mainWindow = null;
});
}
Here are my scripts from package.json
"scripts": {
"start": "nf start -p 3000",
"start-electron": "set ELECTRON_START_URL=http://localhost:3000 && electron .",
"react-start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build-electron": "npm run build && electron-builder build --win"
}
Here's the build part too. To be honest, I don't really understand what this is or does but after a few hours of trial and error this is what gets me to the point I am now.
"build": {
"appId": "Test",
"extends": null,
"files": [
"./build/**/*",
"./electron/main.js",
"./src/**/*"
]
}
As far as I can tell, it has something to do with the Electron start URL, because when I removed that from const startUrl in createWindow, running the app using npm start did the same thing as the built Electron app, whereas before using npm would launch the app normally every time.
EDIT after solution:
Modified build in package.json to
"build": {
"appId": "Test",
"extends": null,
"files": [
"./build/**/*",
"./electron/main.js",
"./src/**/*"
],
"directories": {
"buildResources": "./public"
}
}
I haven't tested it without this modification so I'm not sure that it's actually necessary.
Start URL was changed to
const startUrl = process.env.ELECTRON_START_URL || url.format({
pathname: path.join(__dirname, '../build/index.html'),
protocol: 'file:',
slashes: true,
});
You're supposed to set it up with an html file.
const startUrl = process.env.ELECTRON_START_URL || url.format({
pathname: path.join(__dirname, '../src/index.html'),
protocol: 'file:',
slashes: true,
});
Your browser window should load the build/index.html on production mode
const isDev = require("electron-is-dev");
if (isDev) {
mainWindow.loadURL(process.env.ELECTRON_START_URL);
} else {
mainWindow.loadFile(path.join("build", "index.html"));
}

Detox tests are assigned to Undefined, and all e2e are skipped

I installed jest and detox on a fresh react-native init project.
Install jest and jest-circus as per detox docs
Setup iOS build and test configuration
Get the following error consistently on new builds
my .detoxrc.json file:
{
"testRunner": "jest",
"runnerConfig": "e2e/config.json",
"configurations": {
"ios": {
"type": "ios.simulator",
"build": "xcodebuild -workspace ios/rndetox.xcworkspace -scheme rndetox -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build",
"binaryPath": "ios/build/Build/Products/Debug-iphonesimulator/rndetox.app",
"device": {
"type": "iPhone 11"
}
},
"android": {
"type": "android.emulator",
"binaryPath": "SPECIFY_PATH_TO_YOUR_APP_BINARY",
"device": {
"avdName": "Pixel_2_API_29"
}
}
}
}
detox config.json
{
"testEnvironment": "./environment",
"testRunner": "jest-circus/runner",
"testTimeout": 120000,
"testRegex": "\\.e2e\\.js$",
"reporters": ["detox/runners/jest/streamlineReporter"],
"verbose": true
}
and e2e/environment.js
const {
DetoxCircusEnvironment,
SpecReporter,
WorkerAssignReporter,
} = require('detox/runners/jest-circus');
class CustomDetoxEnvironment extends DetoxCircusEnvironment {
constructor(config) {
super(config);
// Can be safely removed, if you are content with the default value (=300000ms)
this.initTimeout = 300000;
// This takes care of generating status logs on a per-spec basis. By default, Jest only reports at file-level.
// This is strictly optional.
this.registerListeners({
SpecReporter,
WorkerAssignReporter,
});
}
}
module.exports = CustomDetoxEnvironment;
I have tried including an init.js with a detox.init but same error.
At the time I tried this, detox was not supported yet on the fresh 0.63 release of React Native. If you build a new project at 0.62 it should be fine. I am not sure if this has been fixed yet though!

Resources