Upgrade to parcel v2 and node 14 support (#397)

* Initial commit for parcel v2 support * proper file paths * Find an available port automatically if given one is occupied * some refactoring and tests * refactoring and minor fixes * Adding parcel so linkages could work * cleanup * parcel upgrade to beta.3.1 * bump dependencies, remove parcel and fix babel-runtime dependency
adobe · May 26, 2021 · 66a7a10 · 66a7a10
1 parent 994dbd0
commit 66a7a10
Show file tree

Hide file tree

Showing 9 changed files with 115 additions and 140 deletions.
diff --git a/package.json b/package.json
@@ -9,9 +9,9 @@
     "@adobe/aio-lib-core-logging": "^1.1.0",
     "@adobe/aio-lib-env": "^1.0.0",
     "@adobe/aio-lib-ims": "^4.1.0",
-    "@adobe/aio-lib-runtime": "^1.5.0",
-    "@adobe/aio-lib-web": "^4.1.1",
-    "@adobe/generator-aio-app": "^1.9.0",
+    "@adobe/aio-lib-runtime": "^2.0.0",
+    "@adobe/aio-lib-web": "^5.0.0",
+    "@adobe/generator-aio-app": "^2.0.0",
     "@adobe/generator-aio-console": "^2.0.6",
     "@oclif/command": "^1.5.11",
     "@oclif/config": "^1.12.9",
@@ -42,6 +42,7 @@
     "@adobe/eslint-config-aio-lib-config": "^1.2.0",
     "@oclif/dev-cli": "^1.21.3",
     "@types/jest": "^26.0.10",
+    "babel-runtime": "^6.26.0",
     "codecov": "^3.6.1",
     "eol": "^0.9.1",
     "eslint": "^6.0.0",

diff --git a/src/commands/app/build.js b/src/commands/app/build.js
@@ -76,14 +76,13 @@ class Build extends BaseCommand {
             if (!script) {
               const entryFile = config.web.src + '/index.html'
               const bundleOptions = {
-                cache: false,
-                contentHash: flags['content-hash'],
-                minify: false,
-                watch: false,
-                logLevel: flags.verbose ? 4 : 2
+                shouldDisableCache: true,
+                shouldContentHash: flags['content-hash'],
+                shouldOptimize: false,
+                logLevel: flags.verbose ? 'verbose' : 'warn'
               }
-              const { bundler } = await bundle(entryFile, config.web.distProd, bundleOptions, onProgress)
-              await bundler.bundle()
+              const bundler = await bundle(entryFile, config.web.distProd, bundleOptions, onProgress)
+              await bundler.run()
             }
             spinner.succeed(chalk.green('Building web assets'))
           } catch (err) {

diff --git a/src/commands/app/run.js b/src/commands/app/run.js
@@ -50,9 +50,9 @@ class Run extends BaseCommand {
       skipServe: !flags.serve,
       // todo: any other params we should add here?
       parcel: {
-        logLevel: flags.verbose ? 4 : 2,
+        logLevel: flags.verbose ? 'verbose' : 'warn',
         // always set to false on localhost to get debugging and hot reloading
-        contentHash: false
+        shouldContentHash: false
       },
       fetchLogs: true,
       devRemote: !flags.local,

diff --git a/src/lib/bundle-serve.js b/src/lib/bundle-serve.js
@@ -11,8 +11,6 @@ governing permissions and limitations under the License.
 */
 
 const aioLogger = require('@adobe/aio-lib-core-logging')('@adobe/aio-cli-plugin-app:bundle-serve', { provider: 'debug' })
-const httpTerminator = require('http-terminator')
-const { defaultHttpServerPort: SERVER_DEFAULT_PORT } = require('./defaults')
 
 /**
  * @typedef {object} BundleWebObject
@@ -24,34 +22,24 @@ const { defaultHttpServerPort: SERVER_DEFAULT_PORT } = require('./defaults')
  * Serves the bundled web source via Parcel.
  *
  * @param {object} bundler the Parcel bundler object
- * @param {number} uiPort the port number for the http server
  * @param {object} [options] the Parcel bundler options
  * @param {Function} [log] the app logger
  * @returns {BundleWebObject} the BundleWebObject
  */
-module.exports = async (bundler, uiPort = SERVER_DEFAULT_PORT, options = {}, log = () => {}) => {
+module.exports = async (bundler, options, log = () => {}) => {
   log('serving front-end using bundler serve...')
-  let actualPort = uiPort
 
-  aioLogger.debug(`bundle-serve uiPort: ${uiPort}`)
-  aioLogger.debug(`bundle-serve options: ${JSON.stringify(options, null, 2)}`)
-
-  const uiServer = await bundler.serve(uiPort, options.https)
-  actualPort = uiServer.address().port
-  const terminator = httpTerminator.createHttpTerminator({
-    server: uiServer
+  const { unsubscribe } = await bundler.watch((err) => {
+    if (err) {
+      log(err)
+    }
   })
-
-  if (actualPort !== uiPort) {
-    log(`Could not use port:${uiPort}, using port:${actualPort} instead`)
-  }
-
-  const url = `${options.https ? 'https:' : 'http:'}//localhost:${actualPort}`
+  const url = `${options.serveOptions.https ? 'https:' : 'http:'}//localhost:${options.serveOptions.port}`
   log(`local frontend server running at ${url}`)
 
   const cleanup = async () => {
     aioLogger.debug('cleanup bundle-serve...')
-    await terminator.terminate()
+    await unsubscribe()
   }
 
   return {

diff --git a/src/lib/run-dev.js b/src/lib/run-dev.js
@@ -27,15 +27,15 @@ const actionsWatcher = require('./actions-watcher')
 
 const utils = require('./app-helper')
 const { run: logPoller } = require('./log-poller')
+const getPort = require('get-port')
 
 /** @private */
 async function runDev (config, options = {}, log = () => {}) {
   /* parcel bundle options */
   const bundleOptions = {
-    cache: false,
-    contentHash: true,
-    minify: false,
-    watch: false,
+    shouldDisableCache: true,
+    shouldContentHash: true,
+    shouldOptimize: false,
     ...options.parcel
   }
   /* skip actions */
@@ -47,8 +47,11 @@ async function runDev (config, options = {}, log = () => {}) {
   const hasFrontend = config.app.hasFrontend
   const withBackend = config.app.hasBackend && !skipActions
   const isLocal = !options.devRemote // applies only for backend
-  const uiPort = parseInt(process.env.PORT) || SERVER_DEFAULT_PORT
-
+  const portToUse = parseInt(process.env.PORT) || SERVER_DEFAULT_PORT
+  const uiPort = await getPort({ port: portToUse })
+  if (uiPort !== portToUse) {
+    log(`Could not use port:${portToUse}, using port:${uiPort} instead`)
+  }
   aioLogger.debug(`hasFrontend ${hasFrontend}`)
   aioLogger.debug(`withBackend ${withBackend}`)
   aioLogger.debug(`isLocal ${isLocal}`)
@@ -100,10 +103,14 @@ async function runDev (config, options = {}, log = () => {}) {
         const script = await utils.runPackageScript('build-static')
         if (!script) {
           const entryFile = config.web.src + '/index.html'
-          bundleOptions.watch = true
-          const { bundler, cleanup: bundlerCleanup } = await bundle(entryFile, config.web.distDev, bundleOptions, log)
-          defaultBundler = bundler
-          cleanup.add(() => bundlerCleanup(), 'cleaning up bundle...')
+          bundleOptions.serveOptions = {
+            port: uiPort,
+            https: bundleOptions.https
+          }
+          bundleOptions.additionalReporters = [
+            { packageName: '@parcel/reporter-dev-server', resolveFrom: __filename }
+          ]
+          defaultBundler = await bundle(entryFile, config.web.distDev, bundleOptions, log)
         }
       }
     }
@@ -121,7 +128,7 @@ async function runDev (config, options = {}, log = () => {}) {
         if (!script) {
           let result
           if (defaultBundler) {
-            result = await bundleServe(defaultBundler, uiPort, bundleOptions, log)
+            result = await bundleServe(defaultBundler, bundleOptions, log)
           } else {
             result = await serve(devConfig.web.distDev, uiPort, bundleOptions, log)
           }

diff --git a/test/commands/app/build.test.js b/test/commands/app/build.test.js
@@ -127,7 +127,7 @@ beforeEach(() => {
   mockWebLib.deployWeb.mockReset()
   mockWebLib.bundle.mockReset()
   mockBundleFunc.mockReset()
-  mockWebLib.bundle.mockResolvedValue({ bundler: { bundle: mockBundleFunc } })
+  mockWebLib.bundle.mockResolvedValue({ run: mockBundleFunc })
   mockFS.existsSync.mockReset()
   helpers.writeConfig.mockReset()
   helpers.runPackageScript.mockReset()
@@ -200,7 +200,7 @@ describe('run', () => {
     expect(mockRuntimeLib.buildActions).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledWith('undefined/index.html', undefined,
-      expect.objectContaining({ cache: false, contentHash: true, logLevel: 2, minify: false, watch: false }),
+      expect.objectContaining({ shouldDisableCache: true, shouldContentHash: true, logLevel: 'warn', shouldOptimize: false }),
       expect.any(Function)
     )
     expect(mockBundleFunc).toHaveBeenCalledTimes(1)
@@ -213,7 +213,7 @@ describe('run', () => {
     expect(mockRuntimeLib.buildActions).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledWith('undefined/index.html', undefined,
-      expect.objectContaining({ cache: false, contentHash: false, logLevel: 2, minify: false, watch: false }),
+      expect.objectContaining({ shouldDisableCache: true, shouldContentHash: false, logLevel: 'warn', shouldOptimize: false }),
       expect.any(Function)
     )
     expect(mockBundleFunc).toHaveBeenCalledTimes(1)
@@ -226,7 +226,7 @@ describe('run', () => {
     expect(mockRuntimeLib.buildActions).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledTimes(1)
     expect(mockWebLib.bundle).toHaveBeenCalledWith('undefined/index.html', undefined,
-      expect.objectContaining({ cache: false, contentHash: false, logLevel: 4, minify: false, watch: false }),
+      expect.objectContaining({ shouldDisableCache: true, shouldContentHash: false, logLevel: 'verbose', shouldOptimize: false }),
       expect.any(Function)
     )
     expect(mockBundleFunc).toHaveBeenCalledTimes(1)
@@ -371,7 +371,7 @@ describe('run', () => {
   test('build (--skip-actions) calls provided log function', async () => {
     mockWebLib.bundle.mockImplementation((a, b, c, log) => {
       log('ok')
-      return { bundler: { bundle: mockBundleFunc } }
+      return { run: mockBundleFunc }
     })
 
     const noScriptFound = undefined
@@ -390,7 +390,7 @@ describe('run', () => {
   test('build (--skip-actions, --verbose) calls provided other log function', async () => {
     mockWebLib.bundle.mockImplementation((a, b, c, log) => {
       log('ok')
-      return { bundler: { bundle: mockBundleFunc } }
+      return { run: mockBundleFunc }
     })
 
     const noScriptFound = undefined

diff --git a/test/commands/app/run.test.js b/test/commands/app/run.test.js
@@ -241,7 +241,7 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: expect.objectContaining({
-        logLevel: 2
+        logLevel: 'warn'
       }),
       devRemote: true
     }), expect.any(Function))
@@ -266,7 +266,7 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: expect.objectContaining({
-        logLevel: 4
+        logLevel: 'verbose'
       }),
       devRemote: true
     }), expect.any(Function))
@@ -293,7 +293,7 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: expect.objectContaining({
-        logLevel: 4
+        logLevel: 'verbose'
       }),
       devRemote: false
     }), expect.any(Function))
@@ -367,8 +367,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -388,8 +388,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -417,8 +417,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -453,8 +453,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -491,8 +491,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -527,8 +527,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH
@@ -564,8 +564,8 @@ describe('run', () => {
     expect(mockRunDev).toHaveBeenCalledTimes(1)
     expect(mockRunDev).toHaveBeenCalledWith(mockConfigData, expect.objectContaining({
       parcel: {
-        contentHash: false,
-        logLevel: 2,
+        shouldContentHash: false,
+        logLevel: 'warn',
         https: {
           cert: PUB_CERT_PATH,
           key: PRIVATE_KEY_PATH