├── .npmignore ├── assets ├── Camembert.jpg └── demo.svg ├── tsconfig.build.json ├── .prettierrc ├── esbuild.js ├── LICENSE ├── .github └── workflows │ └── test.yml ├── .eslintrc.js ├── .all-contributorsrc ├── manifest.json ├── package.json ├── README.md ├── .gitignore ├── src └── index.ts └── tsconfig.json /.npmignore: -------------------------------------------------------------------------------- 1 | src 2 | -------------------------------------------------------------------------------- /assets/Camembert.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/managed-components/demo/HEAD/assets/Camembert.jpg -------------------------------------------------------------------------------- /tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "exclude": ["src/**/*.test.ts"] 4 | } 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "semi": false, 4 | "trailingComma": "es5", 5 | "tabWidth": 2, 6 | "printWidth": 80, 7 | "arrowParens": "avoid" 8 | } 9 | -------------------------------------------------------------------------------- /esbuild.js: -------------------------------------------------------------------------------- 1 | require('esbuild').buildSync({ 2 | entryPoints: ['src/index.ts'], 3 | bundle: true, 4 | minify: true, 5 | platform: 'node', 6 | format: 'esm', 7 | target: ['esnext'], 8 | tsconfig: 'tsconfig.build.json', 9 | outfile: 'dist/index.js', 10 | }) 11 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2022 Cloudflare, Inc. 2 | 3 | Licensed under the Apache License, Version 2.0 (the "License"); 4 | you may not use this file except in compliance with the License. 5 | You may obtain a copy of the License at 6 | 7 | http://www.apache.org/licenses/LICENSE-2.0 8 | 9 | Unless required by applicable law or agreed to in writing, software 10 | distributed under the License is distributed on an "AS IS" BASIS, 11 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | See the License for the specific language governing permissions and 13 | limitations under the License. -------------------------------------------------------------------------------- /.github/workflows/test.yml: -------------------------------------------------------------------------------- 1 | name: 'Build Test' 2 | 3 | on: 4 | push: 5 | branches: 6 | - '**' 7 | 8 | jobs: 9 | build-test: 10 | runs-on: ubuntu-latest 11 | strategy: 12 | matrix: 13 | node-version: [18.x] 14 | steps: 15 | - uses: actions/checkout@v2 16 | - name: Running Node.js ${{ matrix.node-version }} 17 | uses: actions/setup-node@v1 18 | with: 19 | node-version: ${{ matrix.node-version }} 20 | # Actual Tests 21 | - run: npm i 22 | - run: npm run lint --if-present 23 | - run: npm run typecheck --if-present 24 | - run: npm run bundle --if-present 25 | - run: npm run test --if-present 26 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: '@typescript-eslint/parser', 4 | extends: [ 5 | 'eslint:recommended', 6 | 'plugin:@typescript-eslint/recommended', 7 | 'plugin:prettier/recommended', 8 | ], 9 | plugins: ['prettier'], 10 | env: { 11 | node: true, 12 | browser: true, 13 | worker: true, 14 | es2022: true, 15 | }, 16 | rules: { 17 | 'prettier/prettier': 'error', 18 | 'no-unused-vars': 'off', 19 | '@typescript-eslint/no-unused-vars': [ 20 | 'error', 21 | { ignoreRestSiblings: true, argsIgnorePattern: '^_' }, 22 | ], 23 | }, 24 | overrides: [ 25 | { 26 | files: ['*d.ts'], 27 | rules: { 28 | 'no-undef': 'off', 29 | }, 30 | }, 31 | { 32 | files: ['*js'], 33 | globals: { 34 | webcm: 'writable', 35 | }, 36 | }, 37 | ], 38 | } 39 | -------------------------------------------------------------------------------- /.all-contributorsrc: -------------------------------------------------------------------------------- 1 | { 2 | "projectName": "@managed-components/demo", 3 | "projectOwner": "managed-components", 4 | "repoType": "github", 5 | "repoHost": "https://github.com", 6 | "files": [ 7 | "README.md" 8 | ], 9 | "imageSize": 75, 10 | "commit": true, 11 | "commitConvention": "none", 12 | "contributors": [ 13 | { 14 | "login": "simonabadoiu", 15 | "name": "Simona Badoiu", 16 | "avatar_url": "https://avatars.githubusercontent.com/u/1610123?v=4", 17 | "profile": "https://github.com/simonabadoiu", 18 | "contributions": [ 19 | "code" 20 | ] 21 | }, 22 | { 23 | "login": "bjesus", 24 | "name": "Yo'av Moshe", 25 | "avatar_url": "https://avatars.githubusercontent.com/u/55081?v=4", 26 | "profile": "https://yoavmoshe.com/about", 27 | "contributions": [ 28 | "code" 29 | ] 30 | }, 31 | { 32 | "login": "jonnyparris", 33 | "name": "Ruskin", 34 | "avatar_url": "https://avatars.githubusercontent.com/u/6400000?v=4", 35 | "profile": "https://github.com/jonnyparris", 36 | "contributions": [ 37 | "code" 38 | ] 39 | } 40 | ], 41 | "contributorsPerLine": 7 42 | } 43 | -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Demo Component", 3 | "description": "Demo Component", 4 | "namespace": "demo", 5 | "icon": "assets/demo.svg", 6 | "categories": ["Advertising"], 7 | "provides": ["events"], 8 | "allowCustomFields": true, 9 | "permissions": { 10 | "serve_static_files": { 11 | "description": "ExampleTool serves a static file. Not giving this permission will not affect the main purpose of ExampleTool.", 12 | "required": false 13 | }, 14 | "provide_server_functionality": { 15 | "description": "Allow ExampleTool to create a reverse proxy from '/gate' to 'http://n-gate.com' and define custom server side logic.", 16 | "required": true 17 | }, 18 | "client_network_requests": { 19 | "description": "ExampleTool uses cookies to attribute sessions more accurately", 20 | "required": false 21 | }, 22 | "execute_unsafe_scripts": { 23 | "description": "Simple logs for debugging purposes", 24 | "required": false 25 | }, 26 | "provide_widget": { 27 | "description": "Widgets are not the essential part of this component but a very useful one", 28 | "required": false 29 | }, 30 | "access_client_kv": { 31 | "description": "ExampleTool uses cookies to attribute sessions more accurately", 32 | "required": true 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@managed-components/demo", 3 | "version": "1.0.13", 4 | "description": "", 5 | "main": "dist/index.js", 6 | "scripts": { 7 | "lint": "eslint --ext .ts,.js, src", 8 | "lint:fix": "eslint --ext .ts,.js, src --fix", 9 | "bundle": "node esbuild.js", 10 | "build": "npm run test && npm run lint && npm run typecheck && npm run bundle", 11 | "release": "npm run build && npm version patch && npm publish", 12 | "typecheck": "tsc --project tsconfig.build.json --noEmit", 13 | "test": "vitest run --globals --passWithNoTests", 14 | "test:dev": "vitest --globals --passWithNoTests" 15 | }, 16 | "repository": { 17 | "type": "git", 18 | "url": "git+https://github.com/managed-components/demo.git" 19 | }, 20 | "keywords": [ 21 | "webcm", 22 | "managed-components", 23 | "demo" 24 | ], 25 | "author": "Cloudflare Managed Components Team (https://blog.cloudflare.com/zaraz-open-source-managed-components-and-webcm/)", 26 | "license": "Apache-2.0", 27 | "bugs": { 28 | "url": "https://github.com/managed-components/demo/issues" 29 | }, 30 | "homepage": "https://github.com/managed-components/demo#readme", 31 | "devDependencies": { 32 | "@managed-components/types": "^1.3.1", 33 | "@typescript-eslint/eslint-plugin": "^5.27.0", 34 | "all-contributors-cli": "^6.20.0", 35 | "esbuild": "^0.14.42", 36 | "eslint": "^8.16.0", 37 | "eslint-config-prettier": "^8.5.0", 38 | "eslint-plugin-prettier": "^4.0.0", 39 | "ts-node": "^10.8.0", 40 | "typescript": "^4.7.2", 41 | "vitest": "^0.13.0" 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Demo Managed Component 2 | 3 | Find out more about Managed Components [here](https://blog.cloudflare.com/zaraz-open-source-managed-components-and-webcm/) for inspiration and motivation details. 4 | 5 | 6 | 7 | [![All Contributors](https://img.shields.io/badge/all_contributors-3-orange.svg?style=flat-square)](#contributors-) 8 | 9 | 10 | 11 | [![Released under the Apache license.](https://img.shields.io/badge/license-apache-blue.svg)](./LICENSE) 12 | [![PRs welcome!](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](./CONTRIBUTING.md) 13 | [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) 14 | 15 | ## 🚀 Quickstart local dev environment 16 | 17 | 1. Make sure you're running node version >=18. 18 | 2. Install dependencies with `npm i` 19 | 3. Run unit test watcher with `npm run test:dev` 20 | 21 | ## 📝 License 22 | 23 | Licensed under the [Apache License](./LICENSE). 24 | 25 | ## 💜 Thanks 26 | 27 | Thanks to everyone contributing in any manner for this repo and to everyone working on Open Source in general. 28 | 29 | ## Contributors ✨ 30 | 31 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 |

Simona Badoiu
💻
Yo'av Moshe
💻
Ruskin
💻
43 | 44 | 45 | 46 | 47 | 48 | 49 | This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! 50 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by https://www.toptal.com/developers/gitignore/api/node 2 | # Edit at https://www.toptal.com/developers/gitignore?templates=node 3 | 4 | ### Node ### 5 | # Logs 6 | logs 7 | *.log 8 | npm-debug.log* 9 | yarn-debug.log* 10 | yarn-error.log* 11 | lerna-debug.log* 12 | .pnpm-debug.log* 13 | 14 | # Diagnostic reports (https://nodejs.org/api/report.html) 15 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 16 | 17 | # Runtime data 18 | pids 19 | *.pid 20 | *.seed 21 | *.pid.lock 22 | 23 | # Directory for instrumented libs generated by jscoverage/JSCover 24 | lib-cov 25 | 26 | # Coverage directory used by tools like istanbul 27 | coverage 28 | *.lcov 29 | 30 | # nyc test coverage 31 | .nyc_output 32 | 33 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 34 | .grunt 35 | 36 | # Bower dependency directory (https://bower.io/) 37 | bower_components 38 | 39 | # node-waf configuration 40 | .lock-wscript 41 | 42 | # Compiled binary addons (https://nodejs.org/api/addons.html) 43 | build/Release 44 | 45 | # Dependency directories 46 | node_modules/ 47 | jspm_packages/ 48 | 49 | # Snowpack dependency directory (https://snowpack.dev/) 50 | web_modules/ 51 | 52 | # TypeScript cache 53 | *.tsbuildinfo 54 | 55 | # Optional npm cache directory 56 | .npm 57 | 58 | # Optional eslint cache 59 | .eslintcache 60 | 61 | # Optional stylelint cache 62 | .stylelintcache 63 | 64 | # Microbundle cache 65 | .rpt2_cache/ 66 | .rts2_cache_cjs/ 67 | .rts2_cache_es/ 68 | .rts2_cache_umd/ 69 | 70 | # Optional REPL history 71 | .node_repl_history 72 | 73 | # Output of 'npm pack' 74 | *.tgz 75 | 76 | # Yarn Integrity file 77 | .yarn-integrity 78 | 79 | # dotenv environment variable files 80 | .env 81 | .env.development.local 82 | .env.test.local 83 | .env.production.local 84 | .env.local 85 | 86 | # parcel-bundler cache (https://parceljs.org/) 87 | .cache 88 | .parcel-cache 89 | 90 | # Next.js build output 91 | .next 92 | out 93 | 94 | # Nuxt.js build / generate output 95 | .nuxt 96 | dist 97 | 98 | # Gatsby files 99 | .cache/ 100 | # Comment in the public line in if your project uses Gatsby and not Next.js 101 | # https://nextjs.org/blog/next-9-1#public-directory-support 102 | # public 103 | 104 | # vuepress build output 105 | .vuepress/dist 106 | 107 | # vuepress v2.x temp and cache directory 108 | .temp 109 | 110 | # Docusaurus cache and generated files 111 | .docusaurus 112 | 113 | # Serverless directories 114 | .serverless/ 115 | 116 | # FuseBox cache 117 | .fusebox/ 118 | 119 | # DynamoDB Local files 120 | .dynamodb/ 121 | 122 | # TernJS port file 123 | .tern-port 124 | 125 | # Stores VSCode versions used for testing VSCode extensions 126 | .vscode-test 127 | 128 | # yarn v2 129 | .yarn/cache 130 | .yarn/unplugged 131 | .yarn/build-state.yml 132 | .yarn/install-state.gz 133 | .pnp.* 134 | 135 | ### Node Patch ### 136 | # Serverless Webpack directories 137 | .webpack/ 138 | 139 | # Optional stylelint cache 140 | 141 | # SvelteKit build / generate output 142 | .svelte-kit 143 | 144 | # End of https://www.toptal.com/developers/gitignore/api/node 145 | 146 | .vscode 147 | -------------------------------------------------------------------------------- /assets/demo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | import { ComponentSettings, Manager } from '@managed-components/types' 2 | 3 | export default async function (manager: Manager, settings: ComponentSettings) { 4 | // FYI - You can use fetch to get some remote preferences here based on `settings` 5 | 6 | const myRoute = manager.route('/resetCache', (request: Request) => { 7 | manager.invalidateCache('weather-Iceland') 8 | manager.invalidateCache('weather-Tobago') 9 | manager.invalidateCache('weather-Kyoto') 10 | return new Response(`You made a ${request.method} request`) 11 | }) 12 | console.log(':::: exposes an endpoint at', myRoute) 13 | 14 | const myProxiedRoute = manager.proxy('/gate/*', 'http://n-gate.com') 15 | console.log(`:::: proxies ${myProxiedRoute} to http://n-gate.com`) 16 | 17 | const myStaticFile = manager.serve('/cheese', 'assets/Camembert.jpg') 18 | console.log(`:::: serves a file at ${myStaticFile}`) 19 | 20 | if (settings.ecommerce) { 21 | manager.addEventListener('ecommerce', event => { 22 | console.log('event:', event) 23 | if (event.name === 'Purchase') { 24 | console.info('Ka-ching! 💰', event.payload) 25 | } 26 | }) 27 | } 28 | 29 | manager.addEventListener('request', event => { 30 | console.log('event:', event.payload) 31 | console.log('\u{1F6D2} 🧱 Triggered by every request') 32 | }) 33 | 34 | manager.addEventListener('response', event => { 35 | console.log('event:', event.payload) 36 | console.log('\u{1F6D2} 🎁 Doing something on response') 37 | }) 38 | 39 | manager.addEventListener('remarketing', event => { 40 | console.log('event:', event.payload) 41 | console.log('🛒 Remarketing event was sent to demo component') 42 | }) 43 | 44 | manager.createEventListener('mousemove', async event => { 45 | const { payload } = event 46 | console.info('🐁 🪤 Mousemove:', JSON.stringify(payload, null, 2)) 47 | }) 48 | 49 | manager.createEventListener('mousedown', async event => { 50 | // Save mouse coordinates as a cookie 51 | const { client, payload } = event 52 | console.info('🐁 ⬇️ Mousedown payload:', payload) 53 | const [firstClick] = payload.mousedown 54 | client.set('lastClickX', firstClick.clientX) 55 | client.set('lastClickY', firstClick.clientY) 56 | }) 57 | 58 | manager.createEventListener('historyChange', async event => { 59 | console.info('📣 Ch Ch Ch Chaaanges to history detected!', event.payload) 60 | }) 61 | 62 | manager.createEventListener('resize', async event => { 63 | console.info('🪟 New window size!', JSON.stringify(event.payload, null, 2)) 64 | }) 65 | 66 | manager.createEventListener('scroll', async event => { 67 | console.info( 68 | '🛞🛞🛞 They see me scrollin...they hatin...', 69 | JSON.stringify(event.payload, null, 2) 70 | ) 71 | }) 72 | 73 | manager.createEventListener('resourcePerformanceEntry', async event => { 74 | console.info( 75 | 'Witness the fitness - fresh resource performance entries', 76 | JSON.stringify(event.payload, null, 2) 77 | ) 78 | }) 79 | 80 | manager.addEventListener('clientcreated', ({ client }) => { 81 | console.log('clientcreated!: 🐣') 82 | const clientNumber = client.get('clientNumber') 83 | if (!clientNumber) { 84 | const num = Math.random() 85 | client.set('clientNumber', num.toString()) 86 | } 87 | }) 88 | 89 | manager.addEventListener('event', async event => { 90 | const { client, payload } = event 91 | if (payload.name === 'cheese') { 92 | console.info('🧀🧀 cheese event! 🧀🧀') 93 | client.execute('console.log("🧀🧀 cheese event! 🧀🧀")') 94 | } 95 | payload.user_id = client.get('user_id') 96 | 97 | if (Object.keys(payload || {}).length) { 98 | const params = new URLSearchParams(payload).toString() 99 | manager.fetch(`http://www.example.com/?${params}`) 100 | } 101 | }) 102 | 103 | manager.addEventListener('pageview', async event => { 104 | const { client } = event 105 | console.info( 106 | '📄 Pageview received!', 107 | client.get('user_id'), 108 | client.get('last_page_title'), 109 | client.get('session_id') 110 | ) 111 | const user_id = client.url.searchParams.get('user_id') 112 | client.set('user_id', user_id, { 113 | scope: 'infinite', 114 | }) 115 | if (client.get('clientNumber')) { 116 | client.attachEvent('mousemove') 117 | client.attachEvent('mousedown') 118 | client.attachEvent('historyChange') 119 | client.attachEvent('scroll') 120 | client.attachEvent('resize') 121 | client.attachEvent('resourcePerformanceEntry') 122 | } 123 | client.title && 124 | client.set('last_page_title', client.title, { 125 | scope: 'page', 126 | }) 127 | client.set('session_id', 'session_date_' + new Date().toUTCString(), { 128 | scope: 'session', 129 | }) 130 | client.return('Some very important value') 131 | client.execute('console.info("Page view processed by Demo Component")') 132 | client.fetch('http://example.com', { mode: 'no-cors' }) 133 | }) 134 | 135 | manager.registerEmbed( 136 | 'weather-example', 137 | async ({ parameters }: { parameters: { [k: string]: unknown } }) => { 138 | const location = parameters['location'] 139 | const embed = await manager.useCache('weather-' + location, async () => { 140 | try { 141 | const response = await manager.fetch( 142 | `https://wttr.in/${location}?format=j1` 143 | ) 144 | const data = await response.json() 145 | const [summary] = data.current_condition 146 | const { temp_C } = summary 147 | return `

Temperature in ${location} is: ${temp_C} ℃

` 148 | } catch (error) { 149 | console.error('error fetching weather for embed:', error) 150 | } 151 | }) 152 | return embed 153 | } 154 | ) 155 | 156 | manager.registerWidget(async () => { 157 | const location = 'Colombia' 158 | const widget = await manager.useCache('weather-' + location, async () => { 159 | try { 160 | const response = await manager.fetch( 161 | `https://wttr.in/${location}?format=j1` 162 | ) 163 | const data = await response.json() 164 | const [summary] = data.current_condition 165 | const { temp_C } = summary 166 | return `

Temperature in ${location} is: ${temp_C} ℃

` 167 | } catch (error) { 168 | console.error('error fetching weather for widget:', error) 169 | } 170 | }) 171 | return widget 172 | }) 173 | } 174 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | /* Visit https://aka.ms/tsconfig.json to read more about this file */ 4 | 5 | /* Projects */ 6 | // "incremental": true, /* Enable incremental compilation */ 7 | // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ 8 | // "tsBuildInfoFile": "./", /* Specify the folder for .tsbuildinfo incremental compilation files. */ 9 | // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects */ 10 | // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ 11 | // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ 12 | 13 | /* Language and Environment */ 14 | "target": "es2022" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */, 15 | // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ 16 | // "jsx": "preserve", /* Specify what JSX code is generated. */ 17 | // "experimentalDecorators": true, /* Enable experimental support for TC39 stage 2 draft decorators. */ 18 | // "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ 19 | // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h' */ 20 | // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ 21 | // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using `jsx: react-jsx*`.` */ 22 | // "reactNamespace": "", /* Specify the object invoked for `createElement`. This only applies when targeting `react` JSX emit. */ 23 | // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ 24 | // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ 25 | 26 | /* Modules */ 27 | "module": "esnext" /* Specify what module code is generated. */, 28 | // "rootDir": "./", /* Specify the root folder within your source files. */ 29 | "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */, 30 | // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ 31 | // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ 32 | // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ 33 | // "typeRoots": [], /* Specify multiple folders that act like `./node_modules/@types`. */ 34 | "types": [ 35 | "vitest/globals" 36 | ] /* Specify type package names to be included without being referenced in a source file. */, 37 | // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ 38 | "resolveJsonModule": true /* Enable importing .json files */, 39 | // "noResolve": true, /* Disallow `import`s, `require`s or ``s from expanding the number of files TypeScript should add to a project. */ 40 | 41 | /* JavaScript Support */ 42 | // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the `checkJS` option to get errors from these files. */ 43 | // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ 44 | // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from `node_modules`. Only applicable with `allowJs`. */ 45 | 46 | /* Emit */ 47 | // "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ 48 | // "declarationMap": true, /* Create sourcemaps for d.ts files. */ 49 | // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ 50 | // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ 51 | // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */ 52 | "outDir": "./dist" /* Specify an output folder for all emitted files. */, 53 | // "removeComments": true, /* Disable emitting comments. */ 54 | // "noEmit": true, /* Disable emitting files from a compilation. */ 55 | // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ 56 | // "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types */ 57 | // "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ 58 | // "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ 59 | // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ 60 | // "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ 61 | // "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ 62 | // "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ 63 | // "newLine": "crlf", /* Set the newline character for emitting files. */ 64 | // "stripInternal": true, /* Disable emitting declarations that have `@internal` in their JSDoc comments. */ 65 | // "noEmitHelpers": true, /* Disable generating custom helper functions like `__extends` in compiled output. */ 66 | // "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ 67 | // "preserveConstEnums": true, /* Disable erasing `const enum` declarations in generated code. */ 68 | // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ 69 | 70 | /* Interop Constraints */ 71 | // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ 72 | // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ 73 | "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */, 74 | // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ 75 | "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */, 76 | 77 | /* Type Checking */ 78 | "strict": true /* Enable all strict type-checking options. */, 79 | // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied `any` type.. */ 80 | // "strictNullChecks": true, /* When type checking, take into account `null` and `undefined`. */ 81 | // "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ 82 | // "strictBindCallApply": true, /* Check that the arguments for `bind`, `call`, and `apply` methods match the original function. */ 83 | // "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ 84 | // "noImplicitThis": true, /* Enable error reporting when `this` is given the type `any`. */ 85 | // "useUnknownInCatchVariables": true, /* Type catch clause variables as 'unknown' instead of 'any'. */ 86 | // "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ 87 | // "noUnusedLocals": true, /* Enable error reporting when a local variables aren't read. */ 88 | // "noUnusedParameters": true, /* Raise an error when a function parameter isn't read */ 89 | // "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ 90 | // "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ 91 | // "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ 92 | // "noUncheckedIndexedAccess": true, /* Include 'undefined' in index signature results */ 93 | // "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ 94 | // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type */ 95 | // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ 96 | // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ 97 | 98 | /* Completeness */ 99 | // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ 100 | "skipLibCheck": true /* Skip type checking all .d.ts files. */ 101 | } 102 | } 103 | --------------------------------------------------------------------------------