From 2433c22b3daedc5cdfa18a7e4eacbeb77e4ac7b7 Mon Sep 17 00:00:00 2001 From: Emin Khateeb Date: Tue, 5 Mar 2019 12:20:25 +0100 Subject: [PATCH] prepared for RN 0.59 release --- App.tsx | 4 ++-- README.md | 21 ++++++-------------- __tests__/{App.tsx => App-test.tsx} | 2 +- devDependencies.json | 1 - jest.config.js | 4 ++++ jest.json | 8 -------- package.json | 2 +- setup.js | 30 +++++++---------------------- 8 files changed, 21 insertions(+), 51 deletions(-) rename __tests__/{App.tsx => App-test.tsx} (98%) create mode 100644 jest.config.js delete mode 100644 jest.json diff --git a/App.tsx b/App.tsx index af5ed19..fc62f2e 100644 --- a/App.tsx +++ b/App.tsx @@ -4,7 +4,7 @@ * * Generated with the TypeScript template * https://github.com/emin93/react-native-template-typescript - * + * * @format */ @@ -48,4 +48,4 @@ const styles = StyleSheet.create({ color: '#333333', marginBottom: 5, }, -}); +}); \ No newline at end of file diff --git a/README.md b/README.md index 5a0afb6..4a2bfe0 100644 --- a/README.md +++ b/README.md @@ -13,38 +13,29 @@ Clean and minimalist React Native template for a quick start with TypeScript. ## :arrow_forward: Quick Start ```bash -react-native init MyApp --template typescript && node MyApp/setup.js +react-native init MyApp --template typescript ``` ## :question: FAQ -### Why this template when React Native 0.57+ supports TypeScript out of the box? - -Actually, when React Native 0.57 was announced, I planned to stop maintenance on this template. But after further evaluation, there's still quite a lot of manual work to do (add type definitions for React & React Native, create a `.tsconfig` for type checking, etc.) to properly set up a React Native 0.57+ TypeScript project. And that's where this template comes in and does that work for you. :raised_hands: - ### What additional dependencies are included in this template? - [TypeScript](https://github.com/Microsoft/TypeScript) - [Type definitions for React & React Native](https://github.com/DefinitelyTyped/DefinitelyTyped) -- [ts-jest](https://github.com/kulshekhar/ts-jest) This template always uses the latest versions of the dependencies at the time when the `react-native init` command is being executed. This means you don't have to worry about old versions. Lots of :heart: and credits to the owners and maintainers of those packages. -### Why the setup script? +### Does debugging work? -It deletes obsolete files like the `.flowconfig` and the `setup.js` itself after the setup. +Yes it does. :tada: + +[![Demonstration of working breakpoints in Visual Studio Code](https://cdn-images-1.medium.com/max/1600/1*ZXfzgq1xKz1B3chYy9xE7w.png)](https://medium.com/@emin93/react-native-typescript-b965059109d3) ### How to do type checking? -`npm run tsc` - -### Does debugging work? - -Yes it does. - -[![Demonstration of working breakpoints in Visual Studio Code](https://cdn-images-1.medium.com/max/1600/1*ZXfzgq1xKz1B3chYy9xE7w.png)](https://medium.com/@emin93/react-native-typescript-b965059109d3) +`npx tsc` ## :globe_with_meridians: Links diff --git a/__tests__/App.tsx b/__tests__/App-test.tsx similarity index 98% rename from __tests__/App.tsx rename to __tests__/App-test.tsx index 1784766..a5f5c83 100644 --- a/__tests__/App.tsx +++ b/__tests__/App-test.tsx @@ -11,4 +11,4 @@ import renderer from 'react-test-renderer'; it('renders correctly', () => { renderer.create(); -}); +}); \ No newline at end of file diff --git a/devDependencies.json b/devDependencies.json index 08f4720..4846c54 100644 --- a/devDependencies.json +++ b/devDependencies.json @@ -3,6 +3,5 @@ "@types/react-native": "latest", "@types/react-test-renderer": "latest", "@types/react": "latest", - "ts-jest": "latest", "typescript": "latest" } diff --git a/jest.config.js b/jest.config.js new file mode 100644 index 0000000..2e0df3d --- /dev/null +++ b/jest.config.js @@ -0,0 +1,4 @@ +module.exports = { + preset: 'react-native', + moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'], +} diff --git a/jest.json b/jest.json deleted file mode 100644 index 236f081..0000000 --- a/jest.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "transform": { - "^.+\\.tsx?$": "ts-jest" - }, - "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$", - "moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"], - "modulePaths": [""] -} diff --git a/package.json b/package.json index e849428..48d4377 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-template-typescript", - "version": "0.0.1", + "version": "4.1.10", "description": "Clean and minimalist React Native template for a quick start with TypeScript.", "scripts": { "test": "standard setup.js", diff --git a/setup.js b/setup.js index f987c1b..599cdc9 100644 --- a/setup.js +++ b/setup.js @@ -1,29 +1,13 @@ const fs = require('fs') const path = require('path') -const packageJson = require('./package.json') -const jestConfig = require('./jest.json') +const projectFilesToDelete = ['.flowconfig', 'App.js', '__tests__/App-test.js'] -if (!packageJson.jest) { - process.exit() -} +const templateFilesToDelete = ['setup.js', 'README.md', 'LICENSE'] -const deleteFile = fileName => fs.unlinkSync(path.join(__dirname, fileName)) -const writeFile = (fileName, data) => fs.writeFileSync(path.join(__dirname, fileName), data) +const projectPath = path.join(__dirname, '..', '..') +const deleteProjectFile = fileName => fs.unlinkSync(path.join(projectPath, fileName)) +const deleteTemplateFile = fileName => fs.unlinkSync(path.join(__dirname, fileName)) -console.log('🔄 Setting up...') - -packageJson.scripts.tsc = 'tsc' -packageJson.jest = Object.assign(packageJson.jest, jestConfig) - -writeFile('package.json', JSON.stringify(packageJson, null, 2)) - -deleteFile('.flowconfig') -deleteFile('App.js') -deleteFile('__tests__/App.js') -deleteFile('jest.json') -deleteFile('LICENSE') -deleteFile('README.md') -deleteFile('setup.js') - -console.log(`✅ Setup completed!`) +projectFilesToDelete.forEach(deleteProjectFile) +templateFilesToDelete.forEach(deleteTemplateFile)