Categories
Mastering Development

How to test react navigation authentication flow?

I’m developing a React Native application. I’m doing something like what’s explained here to implement the authentication flow. So, I created an AppContainer that looks like this: import {createAppContainer, createSwitchNavigator, createStackNavigator} from “react-navigation”; import AuthLoadingScreen from “../screens/auth/auth-loading-screen”; const AppStack = createStackNavigator({ Home: {screen: HomeScreen} }); const AuthStack = createStackNavigator({ SignIn: {screen: SignInScreen} }); const AppContainer […]

Categories
Development

Babel-node ignores or misbehaves when I add ignore option to babel.config.js

am using the command npx babel-node –ignore=’ ‘ –extensions=’.ts,.tsx,.js,.jsx,.es6,.es’ test.js to compile the script named test.js . test.js imports import template from ‘lodash-es/template’; and I would like it to be compiled too. Adding ignore or include or exclude options regex at babel.config.js doesn’t work. How do i add an inline –ignore option ({ ignore: [/node_modules\/(?!lodash-es)/] […]

Categories
Development

How to distribute package for expo? (.web.js, .js configuration)

I want to distribute a package for expo. This package was created while building my app in expo SDK36. Like many expo dependencies, I use massively the .ios.js, .android.js and .web.js extensions. While importing a source I have distributed on npm, resolver only import .js without any distinction. As an example this package should work […]

Categories
Development

Eslint not working with the TypeScript syntax

I am trying to configure eslint for my REACT-TypeScript project. It was previously using tslint which is going to deprecate soon. I have gone through the web and finally was able to create my .eslintrc.json: { “parser”: “@typescript-eslint/parser”, “parserOptions”: { “ecmaFeatures”: { “jsx”: true }, “project”: “./tsconfig.json”, “ecmaVersion”: 2018, “sourceType”: “module” }, “env”: { “browser”: […]

Categories
Development

Webpack production build always returns This page is using the development build of React

I am trying to use webpack-4 to get the production build of react (The project is not created usinf Create React App), but not successful. My project is using typescript and using ts-loader and using the version of React 15.6.2. The current webpack config file const path = require(“path”); module.exports = { entry: [‘./lib/tproj/js/index.ts’], output: […]

Categories
Development

Webpack bundle imports with an @

I am trying to bundle a Node Express server built with TypeScript using Webpack. Compiling/Transpiling into one JavaScript file server.js works well, but the file does not seem to have all necessary imports included. If the file is in dist/server.js and there are still Node modules in node_modules/…, then starting the server using node dist/server.js […]

Categories
Development

Webpack doesn’t resolve index file in folder

I have the project in which I use React with Typescript and Webpack to bundle all together. I know that if there’s index.tsx file in folder in which I export all necessary files, I can import items from folder like import { item } from ‘path/to/folder’ instead of import { item } from ‘path/to/folder/and/file.tsx’ But […]

Categories
Development

How to tell apollo codegen to look for the exact files for the queries

my project directory structure is like this: – schema.graphql – package.json – packages — types — package.json — src —- graphql-types —– user.ts —– generated Now in here, schema.graphql contains the downloaded schema from apollo client:download-schema. user.ts contains my graphql query like this: export const CURRENT_USER = gql` query CurrentUser { currentUser { id name […]

Categories
Development

Webpack with dynamic entries

I am attempting to dynamically load JS files with webpack to make it easier to add whitelabel customers. Currently I have to keep updating the webpack config to manually add their files each time but I want to set this to a dynamic method so I can just add the JS file(s) when needed and […]