Hi i'm using React Native Code Push currently.
Currently my code is manually handling it because of the need to prevent it from codepushing builds that are in the staging / testing environment. I had a problem earlier when i did a release build for testing, it still picked up the codepush and it refreshed incorrectly.
What is everyone else doing? I can make the codepushoptions on app resume but it'd still pick up the codepush bundle on my staging environments when i only want it on production :/
I considered the staging, and production environments in codepush but that part is quite confusing. not sure if its used at all.
let codePushOptions = { checkFrequency: codePush.CheckFrequency.MANUAL };
And in the code
if ((!(__DEV__)) && (API_BASE_URL === 'https://production.xxx')) { // only run in production
codePush.sync({
updateDialog: null,
installMode: codePush.InstallMode.ON_NEXT_RESTART
},
eh i found that i'd just set different keys per environment and codepush will handle that way.
https://www.youtube.com/watch?v=waatVm6-bX4
Related
It's the first time I'm using next.js and I've experienced some issues like warnings in the console that makes me lose some time looking for the origin of them and in the end if I delete the cache and re-run next dev again, the issue simply disappear.
I expected to have any cli arg such --no-cache that we can use with Parcel or maybe any configuration inside next.config.js but there's nothing in the documentation about generally disabling cache.
I was then thinking about editing the webpack config through next.config.js like:
module.exports = {
webpackDevMiddleware: (config) => {
// options
}
}
But I really don't know if this will collide with any next requirement or if it breaks good practices and can cause any future issue.
Is then possible to avoid cache during development?
By the way, can/should I try to add a --no-source-map-like modifier for production build in Next regarding the client output?
As extra information I created the app using npx create-next-app.
I was trying to integrate a React.js app in Cordova. Everything goes well, but I was not able to debug the app in the simulator. With chrome://inspect it seems like there's no way to do it, because I can only see the "compiled code". Any solution? Thanks
Maybe there is another better way, but what do the trick for me is to build react with some custom files that i took from node_modules/react-scripts/
(i do that, to avoid react eject)
You need all the sources map on your app.
React by default, use a certain webpack config, but that config doesn't work in your phone.
By default, react use this
You can check it on the file node_modules/react-scripts/config/webpack.config.js
What i do, is to build react with the next webpack config
devtool: "eval-source-map",
So you must
Copy these files on your source code and adapt some imports (there are some import with relative path) You only need these two files
node_modules/react-scripts/scripts/build.js
node_modules/react-scripts/config/webpack.config.js
On the first one, modify it to use the second one,
On the second one, add this devtool: "eval-source-map"
Create new task on package.json , new custom build to use the script your custom build.js
Build with this script, and copy all the source maps with your code, and thats it.
The debug could crash sometimes, (i try it also with iphone + safari, sometimes works, sometimes don't so you must keep trying)
On android tend to work in a better way.
The debug is a little bit slow in compare to the web debug.
I hope this works for you too.
(Sorry for my bad English)
ExtJS v7.1 based application has onAppUpdate function and some other methods like onLaunch mentioned in documantation here for classic application. However in development and in testing environment these never gets fired. Is it as intended, if yes then how we can test onAppUpdate in dev or testing build. If no, then what could have gone wrong here.
You can achieve this by enabling Local Storage Cache for a specific build in your app.json file.
Example for the testing build:
/**
* Settings specific to testing builds.
*/
"testing": {
"cache": {
"enable": true
}
},
Every build on the testing environment will now call the onAppUpdate() function.
Note that you'll never see an onAppUpdate event triggered if you are using a dev build; it needs to be packaged (with caching enabled, as #ground_call points out). The point of onAppUpdate is that you've got a cached version which is older than what's now available - no cache, no onAppupdate
If you're willing to trust the infrastructure, and just test what your app does, you can always trigger the onAppUpdate event programmatically, either in a test script or from the JavaScript console.
Actually, I know my question is s weird but really confused me. lodash functions are awesome and using them is a safe way to have a secure and clean code but in my react project when I use get function of lodash, in the development environment it works well as every developer expected.
import get from 'lodash/get';
const hostname = get(window, 'location.hostname');
// => returns the current hostname
But after I run yarn build && yarn start to make a production build of my ReactJS app and run it, its behavior is changed and returns undefined.
import get from 'lodash/get';
const hostname = get(window, 'location.hostname');
// => returns undefined
So in the production build, I try the get(window, 'location') and it returns the location object. but when I put a key of location the lodash get function returns undefined.
Actually, in the production and just for nested it returns undefined
Due to this issue, I just found this post, but no one answer it.
According to this comment I became passionate about testing my production build. So I listed all thing That happens on the production build of my project that maybe causes this issue.
At first, I doubted to babel plugins that I used for transpile, but none of them affect just on production, they affect for whole environments.
And at last, I find LodashModuleReplacementPlugin. this plugin causes this issue.
Based on its doc:
Deep property path support for methods like _.get, _.has, & _.set.
This plugin omit the deep path support on lodash get. That's the point.
I want to start by saying this is my first project with React Redux and Socket.IO.
I also have no knowledge of what it takes to construct proper build, start, and test scripts. My knowledge of webpack is also pretty limited to the point where I only really feel comfortable adding or removing loaders. I find a lot of the pre-configurations in create react app to be very helpful; jest, hot loading, build outputs. As you know react-create-app uses webpackdev server. However, for the server side portion of my app I have a socket.io server similar to this configuration.
import Server from 'socket.io';
export function startServer(store) {
const io = new Server().attach(8090);
store.subscribe(
() => io.emit('state', store.getState().toJS())
);
io.on('connection', (socket) => {
socket.emit('state', store.getState().toJS());
socket.on('action', store.dispatch.bind(store));
});
}
Basically I am looking for a resource or even better an explanation that can help me incorporate socket io and redux with the best parts of react-create-app.
I ended up getting rid of webpack entirely and removed the scripts. I rewrite the test script to a simple jest command. Followed this to finish up the socket.io config. https://teropa.info/blog/2015/09/10/full-stack-redux-tutorial.html
You can also see how the application looks like right now. https://github.com/donleyac/react-card-engine
For the client side I suggest to manage the project following this guide.
Redux guide
For the socket.io integration I suggest using my two redux middlewares that allows you to subscribe events and emit messages using the redux paradigm.
socket.io-emitter-middleware
socket.io-subscriber-middleware
You can install them via the following commands
npm i socket.io-emitter-middleware
npm i socket.io-subscriber-middleware
and following the README from github documentation for the usage.
The server part could go well.
You must not confuse the create-react-app environment with the client/server architecture. The create-react-app environment is only "client side".
You need connect your client react app with the node.js server via socket.io.
I suggest you to start from the socket.io documentation.
Socket.io Introduction