From feb47b2eafd9221c34ce7599ea75e38266e13dd4 Mon Sep 17 00:00:00 2001 From: Jonathon Date: Mon, 4 Nov 2019 16:02:46 -0800 Subject: [PATCH] fix(webpack-config): use custom register-service-worker.js if available (#1159) * fix(webpack-config): use custom register-service-worker.js if available * Prevent register-service-worker from being copied twice --- packages/webpack-config/src/types.ts | 1 + packages/webpack-config/src/utils/paths.ts | 2 + packages/webpack-config/src/webpack.config.ts | 56 +++++++++++-------- packages/webpack-config/src/withWorkbox.ts | 4 +- 4 files changed, 38 insertions(+), 25 deletions(-) diff --git a/packages/webpack-config/src/types.ts b/packages/webpack-config/src/types.ts index d21140edfa..7b73fb4dbe 100644 --- a/packages/webpack-config/src/types.ts +++ b/packages/webpack-config/src/types.ts @@ -63,6 +63,7 @@ export interface FilePathsFolder { serveJson: string; favicon: string; serviceWorker: string; + registerServiceWorker: string; } export interface FilePaths { absolute: PathResolver; diff --git a/packages/webpack-config/src/utils/paths.ts b/packages/webpack-config/src/utils/paths.ts index beba92259c..e8b3f9fb38 100644 --- a/packages/webpack-config/src/utils/paths.ts +++ b/packages/webpack-config/src/utils/paths.ts @@ -106,6 +106,7 @@ function parsePaths(projectRoot: string, nativeAppManifest?: ExpoConfig): FilePa serveJson: templatePath('serve.json'), favicon: templatePath('favicon.ico'), serviceWorker: templatePath('expo-service-worker.js'), + registerServiceWorker: templatePath('register-service-worker.js'), }, production: { get: getProductionPath, @@ -115,6 +116,7 @@ function parsePaths(projectRoot: string, nativeAppManifest?: ExpoConfig): FilePa serveJson: getProductionPath('serve.json'), favicon: getProductionPath('favicon.ico'), serviceWorker: getProductionPath('expo-service-worker.js'), + registerServiceWorker: getProductionPath('register-service-worker.js'), }, }; } diff --git a/packages/webpack-config/src/webpack.config.ts b/packages/webpack-config/src/webpack.config.ts index 398f93dfc7..2af9013934 100644 --- a/packages/webpack-config/src/webpack.config.ts +++ b/packages/webpack-config/src/webpack.config.ts @@ -16,6 +16,8 @@ import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModul import MiniCssExtractPlugin from 'mini-css-extract-plugin'; import CopyWebpackPlugin from 'copy-webpack-plugin'; import { boolish } from 'getenv'; +import path from 'path'; +import webpack from 'webpack'; import { getPathsAsync, getPublicPaths } from './utils/paths'; import createAllLoaders from './loaders/createAllLoaders'; import { ExpoDefinePlugin, ExpoProgressBarPlugin, ExpoHtmlWebpackPlugin } from './plugins'; @@ -24,16 +26,10 @@ import withOptimizations from './withOptimizations'; import withReporting from './withReporting'; import withCompression from './withCompression'; -import path from 'path'; -import webpack from 'webpack'; - import createDevServerConfigAsync from './createDevServerConfigAsync'; import { Arguments, DevConfiguration, FilePaths, Mode } from './types'; -import { - DEFAULT_ALIAS, - overrideWithPropertyOrConfig, -} from './utils/config'; +import { DEFAULT_ALIAS, overrideWithPropertyOrConfig } from './utils/config'; import getMode from './utils/getMode'; import getConfig from './utils/getConfig'; import { Environment } from './types'; @@ -63,21 +59,22 @@ function getDevtool( function getOutput(locations: FilePaths, mode: Mode, publicPath: string): Output { const commonOutput: Output = { - sourceMapFilename: '[chunkhash].map', - // We inferred the "public path" (such as / or /my-project) from homepage. - // We use "/" in development. - publicPath, - // Build folder (default `web-build`) - path: locations.production.folder, - } + sourceMapFilename: '[chunkhash].map', + // We inferred the "public path" (such as / or /my-project) from homepage. + // We use "/" in development. + publicPath, + // Build folder (default `web-build`) + path: locations.production.folder, + }; if (mode === 'production') { commonOutput.filename = 'static/js/[name].[contenthash:8].js'; // There are also additional JS chunk files if you use code splitting. commonOutput.chunkFilename = 'static/js/[name].[contenthash:8].chunk.js'; // Point sourcemap entries to original disk location (format as URL on Windows) - commonOutput.devtoolModuleFilenameTemplate = (info: webpack.DevtoolModuleFilenameTemplateInfo): string => - locations.absolute(info.absoluteResourcePath).replace(/\\/g, '/'); + commonOutput.devtoolModuleFilenameTemplate = ( + info: webpack.DevtoolModuleFilenameTemplateInfo + ): string => locations.absolute(info.absoluteResourcePath).replace(/\\/g, '/'); } else { // Add comments that describe the file import/exports. // This will make it easier to debug. @@ -88,15 +85,18 @@ function getOutput(locations: FilePaths, mode: Mode, publicPath: string): Output // There are also additional JS chunk files if you use code splitting. commonOutput.chunkFilename = 'static/js/[name].chunk.js'; // Point sourcemap entries to original disk location (format as URL on Windows) - commonOutput.devtoolModuleFilenameTemplate = (info: webpack.DevtoolModuleFilenameTemplateInfo): string => - path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'); + commonOutput.devtoolModuleFilenameTemplate = ( + info: webpack.DevtoolModuleFilenameTemplateInfo + ): string => path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'); } return commonOutput; } - -export default async function(env: Environment, argv: Arguments = {}): Promise { +export default async function( + env: Environment, + argv: Arguments = {} +): Promise { const config = getConfig(env); const mode = getMode(env); const isDev = mode === 'development'; @@ -177,7 +177,15 @@ export default async function(env: Environment, argv: Arguments = {}): Promise { const entries = await ensureEntryAsync(expoEntry); - const swPath = join(locations.production.folder, 'register-service-worker.js'); + const swPath = join(locations.production.registerServiceWorker); if (entries.app && !entries.app.includes(swPath) && autoRegister) { const content = (await readFile( - require.resolve('../web-default/register-service-worker.js'), + require.resolve(locations.template.registerServiceWorker), 'utf8' )) .replace('SW_PUBLIC_URL', publicUrl)