Uses rollup for building

config/constants.js

@@ -2,14 +2,12 @@ const path = require('path')
 const packageJson = require('../package.json')
 
 const SERVICE_WORKER_SOURCE_PATH = path.resolve(
-  __dirname,
-  '../src',
-  'mockServiceWorker.js',
+  process.cwd(),
+  'src/mockServiceWorker.js',
 )
 
 const SERVICE_WORKER_BUILD_PATH = path.resolve(
-  __dirname,
-  '..',
+  process.cwd(),
   path.dirname(packageJson.main),
   path.basename(SERVICE_WORKER_SOURCE_PATH),
 )

config/IntegrityWebpackPlugin/utils/copyServiceWorker.js → config/copyServiceWorker.ts

@@ -1,18 +1,17 @@
-const fs = require('fs')
-const path = require('path')
-const util = require('util')
-const chalk = require('chalk')
-const { until } = require('@open-draft/until')
+import * as fs from 'fs'
+import * as path from 'path'
+import * as chalk from 'chalk'
+import { until } from '@open-draft/until'
 
 /**
  * Copies the given Service Worker source file into the destination.
  * Injects the integrity checksum into the destination file.
  */
-module.exports = async function copyServiceWorker(
-  sourceFilePath,
-  destFilePath,
-  checksum,
-) {
+export default async function copyServiceWorker(
+  sourceFilePath: string,
+  destFilePath: string,
+  checksum: string,
+): Promise<void> {
   console.log('Compiling Service Worker...')
 
   const [readError, fileContent] = await until(() =>
@@ -24,11 +23,7 @@ module.exports = async function copyServiceWorker(
   }
 
   const destFileDirectory = path.dirname(destFilePath)
-  console.log(
-    'Checking if "%s" path exists...',
-    destFileDirectory,
-    fs.existsSync(destFileDirectory),
-  )
+  console.log('Checking if "%s" path exists...', destFileDirectory)
 
   if (!fs.existsSync(destFileDirectory)) {
     console.log('Destination directory does not exist, creating...')

config/IntegrityWebpackPlugin/utils/getChecksum.js → config/plugins/rollup-integrity-check-plugin/getChecksum.js

@@ -16,10 +16,7 @@ module.exports = function getChecksum(sourceFilePath) {
     },
   )
 
-  const checksum = crypto
-    .createHash('md5')
-    .update(code, 'utf8')
-    .digest('hex')
+  const checksum = crypto.createHash('md5').update(code, 'utf8').digest('hex')
 
   console.log('Generated checksum: %s', chalk.magenta(checksum))
 

config/plugins/rollup-integrity-check-plugin/index.js

@@ -0,0 +1,45 @@
+const fs = require('fs')
+const path = require('path')
+const chalk = require('chalk')
+const replace = require('@rollup/plugin-replace')
+const getChecksum = require('./getChecksum')
+
+module.exports = function integrityCheck(options) {
+  const { input, output, checksumPlaceholder } = options
+
+  function injectChecksum(checksum) {
+    return {
+      SERVICE_WORKER_CHECKSUM: JSON.stringify(checksum),
+    }
+  }
+
+  return {
+    name: 'integrity-check',
+    renderChunk(...args) {
+      return replace(injectChecksum(this.checksum)).renderChunk(...args)
+    },
+    transform(...args) {
+      return replace(injectChecksum(this.checksum)).transform(...args)
+    },
+    buildStart() {
+      if (!fs.existsSync(input)) {
+        this.error(`Failed to locate the Service Worker file at: ${input}`)
+      }
+
+      console.log('Signing the Service Worker at:\n%s', chalk.cyan(input))
+
+      this.checksum = getChecksum(input)
+      const workerContent = fs.readFileSync(input, 'utf8')
+      const publicWorkerContent = workerContent.replace(
+        checksumPlaceholder,
+        this.checksum,
+      )
+
+      this.emitFile({
+        type: 'asset',
+        fileName: path.basename(output),
+        source: publicWorkerContent,
+      })
+    },
+  }
+}

package.json

@@ -2,14 +2,15 @@
   "name": "msw",
   "version": "0.13.1",
   "description": "Client-side API mocking using Service Workers.",
-  "main": "lib/index.js",
-  "types": "lib/index.d.ts",
+  "main": "lib/umd.js",
+  "module": "lib/esm.js",
+  "types": "lib/types",
   "bin": {
     "msw": "cli/msw.js"
   },
   "scripts": {
     "start": "cross-env NODE_ENV=development webpack --watch",
-    "build": "cross-env NODE_ENV=production webpack",
+    "build": "cross-env NODE_ENV=production rollup -c rollup.config.ts",
     "test": "yarn test:unit && yarn test:integration",
     "test:unit": "cross-env BABEL_ENV=test jest --runInBand",
     "test:integration": "node --max_old_space_size=8000 node_modules/.bin/jest --config=test/jest.config.js --runInBand",
@@ -40,6 +41,10 @@
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.5",
+    "@rollup/plugin-commonjs": "^11.1.0",
+    "@rollup/plugin-json": "^4.0.3",
+    "@rollup/plugin-node-resolve": "^7.1.3",
+    "@rollup/plugin-replace": "^2.3.2",
     "@types/cookie": "^0.3.3",
     "@types/jest": "^25.2.1",
     "@types/node": "^13.7.7",
@@ -57,6 +62,8 @@
     "prettier": "^2.0.4",
     "puppeteer": "^3.0.0",
     "regenerator-runtime": "^0.13.5",
+    "rollup": "^2.6.1",
+    "rollup-plugin-typescript2": "^0.27.0",
     "ts-jest": "^25.4.0",
     "ts-loader": "^7.0.1",
     "ts-node": "^8.8.2",

rollup.config.ts

@@ -0,0 +1,42 @@
+const resolve = require('@rollup/plugin-node-resolve')
+const commonjs = require('@rollup/plugin-commonjs')
+const typescript = require('rollup-plugin-typescript2')
+const json = require('@rollup/plugin-json')
+const packageJson = require('./package.json')
+const integrityCheck = require('./config/plugins/rollup-integrity-check-plugin')
+const {
+  SERVICE_WORKER_SOURCE_PATH,
+  SERVICE_WORKER_BUILD_PATH,
+} = require('./config/constants')
+
+export default {
+  input: 'src/index.ts',
+  output: [
+    {
+      file: packageJson.main,
+      name: 'MockServiceWorker',
+      format: 'umd',
+    },
+    {
+      file: packageJson.module,
+      format: 'es',
+    },
+  ],
+  plugins: [
+    resolve({
+      preferBuiltins: false,
+      mainFields: ['module', 'main', 'jsnext:main', 'browser'],
+      extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    }),
+    json(),
+    integrityCheck({
+      checksumPlaceholder: '<INTEGRITY_CHECKSUM>',
+      input: SERVICE_WORKER_SOURCE_PATH,
+      output: SERVICE_WORKER_BUILD_PATH,
+    }),
+    commonjs(),
+    typescript({
+      useTsconfigDeclarationDir: true,
+    }),
+  ],
+}

tsconfig.json

@@ -1,15 +1,15 @@
 {
   "compileOnSave": true,
   "compilerOptions": {
-    "module": "es2015",
+    "strict": true,
     "target": "es6",
     "moduleResolution": "node",
     "esModuleInterop": true,
     "resolveJsonModule": true,
     "declaration": true,
-    "declarationDir": "./lib",
+    "declarationDir": "lib/types",
     "lib": ["es2017", "ESNext.AsyncIterable", "dom", "webworker"]
   },
   "include": ["global.d.ts", "src/**/*.ts"],
-  "exclude": ["node_modules", "**/*.spec.ts"]
+  "exclude": ["node_modules", "**/*.spec.ts", "**/*.test.ts"]
 }