From f24ec319f18414ba5f1edef7245104e656301819 Mon Sep 17 00:00:00 2001 From: Ken Date: Mon, 18 Feb 2019 12:50:57 -0800 Subject: [PATCH] adding support demo and exercise sub dirs --- step2-01/exercise/index.html | 6 +++ step2-01/exercise/src/async/index.ts | 12 +++++ step2-01/exercise/src/generics/index.ts | 23 ++++++++++ step2-01/exercise/src/index.tsx | 19 ++++++++ step2-01/exercise/src/interfaces/index.ts | 22 +++++++++ step2-01/exercise/src/modules/default.ts | 3 ++ step2-01/exercise/src/modules/index.ts | 19 ++++++++ step2-01/exercise/src/modules/named.ts | 12 +++++ step2-01/exercise/src/spread/index.ts | 15 +++++++ step2-01/exercise/src/types/index.ts | 55 +++++++++++++++++++++++ step2-01/src/async/index.ts | 3 ++ step2-01/src/generics/index.ts | 3 ++ step2-01/src/interfaces/index.ts | 3 ++ step2-01/src/spread/index.ts | 3 ++ step2-01/src/types/index.ts | 3 ++ webpack.config.js | 26 ++++++----- 16 files changed, 215 insertions(+), 12 deletions(-) create mode 100644 step2-01/exercise/index.html create mode 100644 step2-01/exercise/src/async/index.ts create mode 100644 step2-01/exercise/src/generics/index.ts create mode 100644 step2-01/exercise/src/index.tsx create mode 100644 step2-01/exercise/src/interfaces/index.ts create mode 100644 step2-01/exercise/src/modules/default.ts create mode 100644 step2-01/exercise/src/modules/index.ts create mode 100644 step2-01/exercise/src/modules/named.ts create mode 100644 step2-01/exercise/src/spread/index.ts create mode 100644 step2-01/exercise/src/types/index.ts diff --git a/step2-01/exercise/index.html b/step2-01/exercise/index.html new file mode 100644 index 0000000..454cef5 --- /dev/null +++ b/step2-01/exercise/index.html @@ -0,0 +1,6 @@ + + + +
+ + diff --git a/step2-01/exercise/src/async/index.ts b/step2-01/exercise/src/async/index.ts new file mode 100644 index 0000000..c4a34fe --- /dev/null +++ b/step2-01/exercise/src/async/index.ts @@ -0,0 +1,12 @@ +async function fetchSomething() { + const response = await fetch('http://localhost:3000/hello'); + return await response.text(); +} + +// Async functions always returns Promise +fetchSomething().then(text => { + console.log('hello ' + text); +}); + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/exercise/src/generics/index.ts b/step2-01/exercise/src/generics/index.ts new file mode 100644 index 0000000..95e5093 --- /dev/null +++ b/step2-01/exercise/src/generics/index.ts @@ -0,0 +1,23 @@ +// Generics for classes +class Stack { + private data: T[] = []; + + push(item: T) { + this.data.push(item); + } + pop(): T { + return this.data.pop(); + } +} + +const numberStack = new Stack(); +const stringStack = new Stack(); + +// Generics for functions +function reverse(arg: T[]): T[] { + // TODO: implement the logic to reverse the array + return arg; +} + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/exercise/src/index.tsx b/step2-01/exercise/src/index.tsx new file mode 100644 index 0000000..41d949e --- /dev/null +++ b/step2-01/exercise/src/index.tsx @@ -0,0 +1,19 @@ +// Interesting Typescript Topics + +// types +import './types'; + +// interface +import './interfaces'; + +// modularity +import './modules'; + +// generics +import './generics'; + +// await / async +import './async'; + +// spread syntax +import './spread'; diff --git a/step2-01/exercise/src/interfaces/index.ts b/step2-01/exercise/src/interfaces/index.ts new file mode 100644 index 0000000..88e2f17 --- /dev/null +++ b/step2-01/exercise/src/interfaces/index.ts @@ -0,0 +1,22 @@ +interface Car { + make: string; + model: string; +} + +class MyCar implements Car { + make: 'Honda'; + model: 'Accord'; +} + +const myCar: Car = { + make: 'Honda', + model: 'Accord' +}; + +// Interface as Functions +interface InterestingFn { + (someArgs: string): number; +} + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/exercise/src/modules/default.ts b/step2-01/exercise/src/modules/default.ts new file mode 100644 index 0000000..6a9f1db --- /dev/null +++ b/step2-01/exercise/src/modules/default.ts @@ -0,0 +1,3 @@ +export default class DefaultClass { + hello = 'world'; +} diff --git a/step2-01/exercise/src/modules/index.ts b/step2-01/exercise/src/modules/index.ts new file mode 100644 index 0000000..fb47500 --- /dev/null +++ b/step2-01/exercise/src/modules/index.ts @@ -0,0 +1,19 @@ +import { namedConst, namedFn, namedObj, namedConstBracket, namedConst as c } from './named'; +import * as named from './named'; + +// Print out the exports +console.log(namedConst); +console.log(c); +console.log(namedFn()); +console.log(namedObj); +console.log(namedConstBracket); + +// Print out exports through module level import +console.log(named.namedConst); +console.log(named.namedFn()); +console.log(named.namedObj); +console.log(named.namedConstBracket); + +import DefaultClass from './default'; + +console.log(new DefaultClass().hello); diff --git a/step2-01/exercise/src/modules/named.ts b/step2-01/exercise/src/modules/named.ts new file mode 100644 index 0000000..3560907 --- /dev/null +++ b/step2-01/exercise/src/modules/named.ts @@ -0,0 +1,12 @@ +export const namedConst = 5; + +export function namedFn() { + return 5; +} + +export const namedObj = { + hello: 'world' +}; + +const namedConstBracket = 10; +export { namedConstBracket }; diff --git a/step2-01/exercise/src/spread/index.ts b/step2-01/exercise/src/spread/index.ts new file mode 100644 index 0000000..addce19 --- /dev/null +++ b/step2-01/exercise/src/spread/index.ts @@ -0,0 +1,15 @@ +// Destructuring +var [x, y, ...rest] = [1, 2, 3, 4]; +console.log(x, y, rest); // 1,2,[3,4] + +// Array assignment +var list = [1, 2]; +list = [...list, 3, 4]; +console.log(list); // [1,2,3,4] + +// Object assignment +const point2D = { x: 1, y: 2 }; +const point3D = { ...point2D, z: 3 }; + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/exercise/src/types/index.ts b/step2-01/exercise/src/types/index.ts new file mode 100644 index 0000000..a89f240 --- /dev/null +++ b/step2-01/exercise/src/types/index.ts @@ -0,0 +1,55 @@ +// Basic Types +let isDone: boolean = false; +let decimal: number = 6; +let color: string = 'blue'; +let sky: string = `the sky is ${color}`; + +// Function Types +type FibFn = (n: number) => number; + +// Object Types +type Obj = { + [key: string]: string; +}; + +// Object with Specified Keys +type Specific1 = { + foo: string; + bar: number; + common: string; +}; + +type Specific2 = { + alice: string; + bob: number; + common: number; +}; + +// composition +type typeofObj = { + foo: string; + bar: number; + obj: Specific1; +}; + +// union, intersection +type Union = Specific1 | Specific2; +type Intersection = Specific1 & Specific2; + +// casting +let choose1 = { common: '5' }; + +// string literal union +type CatStatus = 'alive' | 'dead' | 'both'; + +// Classes +class Animal {} + +// Illustration purposes only +// In real apps, avoid inheritance if possible +// noted exception: React.Component with react@<16.8.0 +class Cat extends Animal {} +class Dog extends Animal {} + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/src/async/index.ts b/step2-01/src/async/index.ts index bc9d239..c4a34fe 100644 --- a/step2-01/src/async/index.ts +++ b/step2-01/src/async/index.ts @@ -7,3 +7,6 @@ async function fetchSomething() { fetchSomething().then(text => { console.log('hello ' + text); }); + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/src/generics/index.ts b/step2-01/src/generics/index.ts index eed6a06..95e5093 100644 --- a/step2-01/src/generics/index.ts +++ b/step2-01/src/generics/index.ts @@ -18,3 +18,6 @@ function reverse(arg: T[]): T[] { // TODO: implement the logic to reverse the array return arg; } + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/src/interfaces/index.ts b/step2-01/src/interfaces/index.ts index 9037376..88e2f17 100644 --- a/step2-01/src/interfaces/index.ts +++ b/step2-01/src/interfaces/index.ts @@ -17,3 +17,6 @@ const myCar: Car = { interface InterestingFn { (someArgs: string): number; } + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/src/spread/index.ts b/step2-01/src/spread/index.ts index dccb3d7..addce19 100644 --- a/step2-01/src/spread/index.ts +++ b/step2-01/src/spread/index.ts @@ -10,3 +10,6 @@ console.log(list); // [1,2,3,4] // Object assignment const point2D = { x: 1, y: 2 }; const point3D = { ...point2D, z: 3 }; + +// adding an export to turn this into a "module" +export default {}; diff --git a/step2-01/src/types/index.ts b/step2-01/src/types/index.ts index d25ab32..a89f240 100644 --- a/step2-01/src/types/index.ts +++ b/step2-01/src/types/index.ts @@ -50,3 +50,6 @@ class Animal {} // noted exception: React.Component with react@<16.8.0 class Cat extends Animal {} class Dog extends Animal {} + +// adding an export to turn this into a "module" +export default {}; diff --git a/webpack.config.js b/webpack.config.js index ca5b598..fb25eed 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,5 +1,3 @@ -// @ts-check - const path = require('path'); const fs = require('fs'); @@ -8,22 +6,26 @@ const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const entries = {}; -function getEntryPoint(entry) { - if (entry.includes('step') || entry.includes('playground')) { - for (let suffix of ['.js', '.jsx', '.ts', '.tsx']) { - if (fs.existsSync(`./${entry}/src/index${suffix}`)) { - return `./${entry}/src/index${suffix}`; +function* getEntryPoint(step) { + if (step.includes('step') || step.includes('playground')) { + for (let prefix of ['', 'demo/', 'exercise/']) { + for (let suffix of ['.js', '.jsx', '.ts', '.tsx']) { + const entryRequest = `./${step}/${prefix}src/index${suffix}`; + if (fs.existsSync(entryRequest)) { + yield entryRequest; + } } } } + return false; } -fs.readdirSync('./').filter(entry => { - const entryPoint = getEntryPoint(entry); - - if (entryPoint) { - entries[entry] = entryPoint; +fs.readdirSync('./').filter(step => { + for (let entryPoint of getEntryPoint(step)) { + if (entryPoint) { + entries[entryPoint.replace(/\/src\/index.*/, '').replace(/^\.\//, '')] = entryPoint; + } } });