Standardize build (prod), start (dev) and read dev config (#226)

plugins/block-plus-minus/package.json

@@ -5,8 +5,7 @@
     "scripts": {
         "build": "blockly-scripts build",
         "clean": "blockly-scripts clean",
-        "dist": "blockly-scripts build prod",
-        "prepublishOnly": "npm run clean && npm run prod",
+        "prepublishOnly": "npm run clean && npm run build",
         "start": "blockly-scripts start",
         "test": "npm run build && npm run test:mocha",
         "test:mocha": "mocha --ui tdd test/if.js test/list_create.js test/procedures.js test/text_join.js"

plugins/dev-create/templates/block/template.json

@@ -3,9 +3,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start"
   },
   "devDependencies": {

plugins/dev-create/templates/field/template.json

@@ -3,9 +3,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start"
   },
   "devDependencies": {

plugins/dev-create/templates/plugin/template.json

@@ -3,9 +3,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start"
   },
   "devDependencies": {

plugins/dev-create/templates/theme/template.json

@@ -3,9 +3,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start"
   },
   "devDependencies": {

plugins/dev-scripts/config/webpack.config.js

@@ -4,9 +4,10 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 /**
- * @fileoverview Webpack base configuration file.
+ * @fileoverview Webpack configuration file.
  * @author samelh@google.com (Sam El-Husseini)
  */
+'use strict';
 
 const path = require('path');
 const fs = require('fs');
@@ -15,30 +16,32 @@ const appDirectory = fs.realpathSync(process.cwd());
 const resolveApp = (relativePath) => path.resolve(appDirectory, relativePath);
 
 module.exports = (env) => {
-  const devServer = {
-    port: 3000,
-    host: '0.0.0.0',
-    watchOptions: {
-      ignored: /node_modules/,
-    },
-  };
-  if (env.buildTest) {
-    devServer.openPage = 'test';
-    devServer.open = true;
-  }
+  const mode = env.mode;
+  const isProduction = mode === 'production';
+
+  const srcEntry = `./src/index.${['js', 'ts'].find((ext) =>
+    fs.existsSync(resolveApp(`./src/index.${ext}`))
+  )}`;
+  const testEntry = `./test/index.${['js', 'ts'].find((ext) =>
+    fs.existsSync(resolveApp(`./test/index.${ext}`))
+  )}`;
 
-  const src = {
-    name: 'src',
-    mode: env.mode,
-    entry: './src/index.js',
+  return {
+    mode,
+    entry: isProduction ? srcEntry : testEntry,
     devtool: 'source-map',
     output: {
-      path: resolveApp('dist'),
-      publicPath: '/dist/',
-      filename: 'index.js',
+      path: isProduction ? resolveApp('dist') : resolveApp('build'),
+      publicPath: isProduction ? '/dist/' : '/build/',
+      filename: isProduction ? 'index.js' : 'test_bundle.js',
       libraryTarget: 'umd',
       globalObject: 'this',
     },
+    resolve: {
+      alias: {
+        'blockly': resolveApp('node_modules/blockly'),
+      },
+    },
     module: {
       rules: [{
         test: /\.js$/,
@@ -51,48 +54,13 @@ module.exports = (env) => {
         },
       }],
     },
-    devServer: devServer,
-    externals: {
+    externals: isProduction ? {
       'blockly/core': {
         root: 'Blockly',
         commonjs: 'blockly/core',
         commonjs2: 'blockly/core',
         amd: 'blockly/core',
       },
-    },
+    } : {},
   };
-  const webpackExports = [src];
-
-  if (env.buildTest) {
-    const test = {
-      name: 'test',
-      mode: 'development',
-      entry: './test/index.js',
-      devtool: 'source-map',
-      output: {
-        path: resolveApp('build'),
-        publicPath: '/build/',
-        filename: 'test_bundle.js',
-      },
-      resolve: {
-        alias: {
-          'blockly': resolveApp('node_modules/blockly'),
-        },
-      },
-      module: {
-        rules: [{
-          test: /\.js$/,
-          exclude: /(node_modules)/,
-          use: {
-            loader: require.resolve('babel-loader'),
-            options: {
-              presets: [require.resolve('@babel/preset-env')],
-            },
-          },
-        }],
-      },
-    };
-    webpackExports.push(test);
-  }
-  return webpackExports;
 };

plugins/dev-scripts/config/webpackDevServer.config.js

@@ -0,0 +1,32 @@
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * @fileoverview Webpack dev server configuration file.
+ * @author samelh@google.com (Sam El-Husseini)
+ */
+'use strict';
+
+const path = require('path');
+const fs = require('fs');
+
+const appDirectory = fs.realpathSync(process.cwd());
+const resolveApp = (relativePath) => path.resolve(appDirectory, relativePath);
+
+module.exports = () => {
+  return {
+    port: 3000,
+    host: '0.0.0.0',
+    hot: true,
+    quiet: true,
+    publicPath: resolveApp('build'),
+    writeToDisk: true,
+    watchOptions: {
+      ignored: /node_modules/,
+    },
+    openPage: 'test',
+    open: true,
+  };
+};

plugins/dev-scripts/package.json

@@ -31,7 +31,6 @@
     "babel-eslint": "^10.1.0",
     "eslint": "^6.8.0",
     "mocha": "^7.1.0",
-    "open": "^7.0.3",
     "rimraf": "^3.0.2",
     "webpack": "^4.41.6",
     "webpack-cli": "^3.3.11",

plugins/dev-scripts/scripts/build.js

@@ -16,7 +16,6 @@
 
 'use strict';
 
-const args = process.argv.slice(2);
 const path = require('path');
 const fs = require('fs');
 
@@ -27,13 +26,11 @@ const appDirectory = fs.realpathSync(process.cwd());
 const resolveApp = (relativePath) => path.resolve(appDirectory, relativePath);
 
 const packageJson = require(resolveApp('package.json'));
-const mode = args.length > 0 && args[0] == 'prod' ?
-  'production' : 'development';
-console.log(`Running ${mode} build for ${packageJson.name}`);
+console.log(`Running production build for ${packageJson.name}`);
 
 // Create the webpack configuration for based on the build environment.
 const config = webpackConfig({
-  mode,
+  mode: 'production',
 });
 
 // Create and run the webpack compiler.

plugins/dev-scripts/scripts/start.js

@@ -18,11 +18,11 @@
 
 const path = require('path');
 const fs = require('fs');
-const open = require('open');
 
 const webpack = require('webpack');
 const WebpackDevServer = require('webpack-dev-server');
 const webpackConfig = require('../config/webpack.config');
+const webpackDevServerConfig = require('../config/webpackDevServer.config');
 
 const appDirectory = fs.realpathSync(process.cwd());
 const resolveApp = (relativePath) => path.resolve(appDirectory, relativePath);
@@ -34,23 +34,19 @@ console.log(`Running start for ${packageJson.name}`);
 // Build the test directory.
 const config = webpackConfig({
   mode: 'development',
-  buildTest: true,
 });
 const compiler = webpack(config);
 
 // Read the webpack devServer configuration.
-const devServerConfig = config[0].devServer;
-const port = devServerConfig.port;
-const host = devServerConfig.host;
-const page = devServerConfig.openPage;
-const URL = `http://${host}:${port}/${page}`;
+const serverConfig = webpackDevServerConfig();
+const port = serverConfig.port;
+const host = serverConfig.host;
 
 // Start the dev server.
-const devServer = new WebpackDevServer(compiler);
-devServer.listen(port, host, async (err) => {
+const devServer = new WebpackDevServer(compiler, serverConfig);
+devServer.listen(port, host, (err) => {
   if (err) {
     return console.log(err);
   }
   console.log('Starting the development server...\n');
-  await open(URL);
 });

plugins/dev-tools/package.json

@@ -5,9 +5,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist"
+    "prepublishOnly": "npm run clean && npm run build"
   },
   "main": "dist/index.js",
   "module": "./src/index.js",

plugins/field-slider/package.json

@@ -5,9 +5,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start",
     "test": "blockly-scripts test"
   },

plugins/theme-modern/package.json

@@ -5,9 +5,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start"
   },
   "main": "./dist/index.js",

plugins/typed-variable-modal/package.json

@@ -5,9 +5,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start",
     "test": "npm run build && npm run test:mocha",
     "test:mocha": "blockly-scripts test"

plugins/workspace-search/package.json

@@ -5,9 +5,8 @@
   "scripts": {
     "build": "blockly-scripts build",
     "clean": "blockly-scripts clean",
-    "dist": "blockly-scripts build prod",
     "lint": "blockly-scripts lint",
-    "prepublishOnly": "npm run clean && npm run dist",
+    "prepublishOnly": "npm run clean && npm run build",
     "start": "blockly-scripts start",
     "test": "npm run build && npm run test:mocha",
     "test:mocha": "blockly-scripts test"