Merged

CHANGELOG.md

@@ -4,10 +4,12 @@
 
 - Fixed `.krasrc` files in pilets to take precendence over emulator
 - Fixed support for `pilets` section in `piral.json` of Piral instance
+- Fixed issue with numeric custom fields supplied to `pilet publish`
 - Updated documentation of `piral-ng` with support of Angular 15
 - Updated `piral-debug-utils` to also work more seamlessly with `piral-base`
 - Updated `piral-cli` to have `pilet build` working without any Piral instances
 - Added variants of `piral-base` (minimal, Node.js, full)
+- Added support for new pilet schema `v3` (default remains at `v2`)
 
 ## 0.15.9 (April 11, 2023)
 

docs/static/schemas/pilet-v0.json

@@ -8,7 +8,7 @@
   "properties": {
     "schemaVersion": {
       "type": "string",
-      "enum": ["none", "v0", "v1", "v2"],
+      "enum": ["none", "v0", "v1", "v2", "v3"],
       "description": "The default output schema to be used when building the pilet."
     },
     "piralInstances": {

src/tooling/piral-cli-webpack5/src/enhancers/pilet-webpack-config-enhancer/index.ts

@@ -9,6 +9,10 @@ import {
   withExternals,
   getDependencies,
 } from './helpers';
+import StylesPlugin from '../../plugins/StylesPlugin';
+import SheetPlugin from '../../plugins/SheetPlugin';
+
+const piletCss = 'main.css';
 
 export interface PiletWebpackConfigEnhancerOptions {
   /**
@@ -34,7 +38,7 @@ export interface PiletWebpackConfigEnhancerOptions {
   /**
    * The schema version. By default, v1 is used.
    */
-  schema?: 'v0' | 'v1' | 'v2' | 'none';
+  schema?: 'v0' | 'v1' | 'v2' | 'v3' | 'none';
   /**
    * The shared dependencies. By default, these are read from the
    * Piral instance.
@@ -72,7 +76,7 @@ function piletVxWebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
 }
 
 function piletV0WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler: Configuration) {
-  const { name, variables, externals, file } = options;
+  const { name, variables, externals, file, entry } = options;
   const shortName = name.replace(/\W/gi, '');
   const jsonpFunction = `pr_${shortName}`;
   const banner = `//@pilet v:0`;
@@ -82,6 +86,7 @@ function piletV0WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
   withExternals(compiler, externals);
 
   compiler.plugins.push(
+    new SheetPlugin(piletCss, name, entry),
     new DefinePlugin(getDefineVariables(variables)),
     new BannerPlugin({
       banner,
@@ -98,7 +103,7 @@ function piletV0WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
 }
 
 function piletV1WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler: Configuration) {
-  const { name, variables, externals, file } = options;
+  const { name, variables, externals, file, entry } = options;
   const shortName = name.replace(/\W/gi, '');
   const jsonpFunction = `pr_${shortName}`;
   const banner = `//@pilet v:1(${jsonpFunction})`;
@@ -108,6 +113,7 @@ function piletV1WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
   withExternals(compiler, externals);
 
   compiler.plugins.push(
+    new SheetPlugin(piletCss, name, entry),
     new DefinePlugin(getDefineVariables(variables)),
     new BannerPlugin({
       banner,
@@ -127,7 +133,7 @@ function piletV1WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
 }
 
 function piletV2WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler: Configuration) {
-  const { name, variables, externals, file, importmap } = options;
+  const { name, variables, externals, file, importmap, entry } = options;
   const shortName = name.replace(/\W/gi, '');
   const jsonpFunction = `pr_${shortName}`;
   const plugins = [];
@@ -139,6 +145,7 @@ function piletV2WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
   const banner = `//@pilet v:2(webpackChunk${jsonpFunction},${JSON.stringify(dependencies)})`;
 
   plugins.push(
+    new SheetPlugin(piletCss, name, entry),
     new DefinePlugin(getDefineVariables(variables)),
     new BannerPlugin({
       banner,
@@ -156,6 +163,39 @@ function piletV2WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler:
   return compiler;
 }
 
+function piletV3WebpackConfigEnhancer(options: SchemaEnhancerOptions, compiler: Configuration) {
+  const { name, variables, externals, file, importmap, entry } = options;
+  const shortName = name.replace(/\W/gi, '');
+  const jsonpFunction = `pr_${shortName}`;
+  const plugins = [];
+
+  withExternals(compiler, externals);
+  setEnvironment(variables);
+
+  const dependencies = getDependencies(importmap, compiler);
+  const banner = `//@pilet v:3(webpackChunk${jsonpFunction},${JSON.stringify(dependencies)})`;
+
+  plugins.push(
+    new StylesPlugin(piletCss, entry),
+    new DefinePlugin(getDefineVariables(variables)),
+    new BannerPlugin({
+      banner,
+      entryOnly: true,
+      include: file,
+      raw: true,
+    }),
+  );
+
+  compiler.output.publicPath = '';
+  compiler.output.chunkFormat = 'module';
+  compiler.plugins = [...compiler.plugins, ...plugins];
+  compiler.output.uniqueName = `${jsonpFunction}`;
+  compiler.output.library = { type: 'system' };
+  compiler.target = 'node';
+
+  return compiler;
+}
+
 export const piletWebpackConfigEnhancer = (details: PiletWebpackConfigEnhancerOptions) => (compiler: Configuration) => {
   const { externals = [], schema, importmap } = details;
   const environment = process.env.NODE_ENV || 'development';
@@ -178,6 +218,8 @@ export const piletWebpackConfigEnhancer = (details: PiletWebpackConfigEnhancerOp
       return piletV1WebpackConfigEnhancer(options, compiler);
     case 'v2':
       return piletV2WebpackConfigEnhancer(options, compiler);
+    case 'v3':
+      return piletV3WebpackConfigEnhancer(options, compiler);
     case 'none':
     default:
       return piletVxWebpackConfigEnhancer(options, compiler);

src/tooling/piral-cli-webpack5/src/plugins/StylesLoader.ts

@@ -0,0 +1,11 @@
+import { getOptions } from 'loader-utils';
+
+export default function stylesLoader() {
+  const { cssName, entries } = getOptions(this);
+  const debug = process.env.NODE_ENV === 'development';
+  return [
+    `const u = ${JSON.stringify(cssName)}`,
+    `export const styles = [${debug ? 'u+"?_="+Math.random()' : 'u'}]`,
+    ...entries.split(',').map((entry) => `export * from ${JSON.stringify(entry)}`),
+  ].join(';');
+}

src/tooling/piral-cli-webpack5/src/plugins/StylesPlugin.ts

@@ -0,0 +1,35 @@
+import { resolve } from 'path';
+import { Compilation } from 'webpack';
+import { RawSource } from 'webpack-sources';
+
+export default class StylesPlugin {
+  constructor(private cssName: string, private entryName: string) {}
+
+  apply(compiler) {
+    const { entry } = compiler.options;
+
+    const entries = entry[this.entryName].import;
+    const query = `cssName=${this.cssName}&entries=${entries.join(',')}!`;
+    const setPath = resolve(__dirname, '..', 'set-path');
+    const loaderPath = resolve(__dirname, `StylesLoader?${query}`);
+
+    entry[this.entryName].import = [setPath, loaderPath];
+
+    compiler.hooks.compilation.tap('StylesPlugin', (compilation: Compilation) => {
+      if (!compilation.compiler.parentCompilation) {
+        compilation.hooks.processAssets.tap(
+          {
+            name: 'StylesPlugin',
+            stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONS,
+          },
+          (assets) => {
+            if (!assets[this.cssName]) {
+              const source = new RawSource('');
+              compilation.emitAsset(this.cssName, source);
+            }
+          },
+        );
+      }
+    });
+  }
+}

src/tooling/piral-cli-webpack5/src/webpack/bundler-run.ts

@@ -8,8 +8,11 @@ function getOutput(stats: webpack.Stats) {
 
   for (const name of Object.keys(entrypoints)) {
     const assets = entrypoints[name].assets;
-    const firstAsset = assets[0];
-    return resolve(outputPath, firstAsset.name);
+    const firstAsset = assets.find((m) => m.name.endsWith('.js') || m.name.endsWith('.mjs'));
+
+    if (firstAsset) {
+      return resolve(outputPath, firstAsset.name);
+    }
   }
 }
 

src/tooling/piral-cli-webpack5/src/webpack/common.ts

@@ -1,12 +1,11 @@
 import * as MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import { progress, logReset, log } from 'piral-cli/utils';
 import { RuleSetRule, ProgressPlugin, WebpackPluginInstance, Configuration } from 'webpack';
-import SheetPlugin from '../plugins/SheetPlugin';
 
 const piletCss = 'main.css';
 
-function getStyleLoaders(production: boolean) {
-  if (production) {
+export function getStyleLoaders(useExtractLoader: boolean) {
+  if (useExtractLoader) {
     return [MiniCssExtractPlugin.loader];
   } else {
     return [require.resolve('style-loader')];
@@ -26,12 +25,12 @@ export function getVariables(): Record<string, string> {
   }, {});
 }
 
-export function getPlugins(plugins: Array<any>, production: boolean, pilet?: string) {
+export function getPlugins(plugins: Array<WebpackPluginInstance>, pilet?: string) {
   const otherPlugins: Array<WebpackPluginInstance> = [
     new MiniCssExtractPlugin({
       filename: pilet ? piletCss : '[name].[fullhash:6].css',
       chunkFilename: '[id].[chunkhash:6].css',
-    }) as any,
+    }),
   ];
 
   if (process.env.WEBPACK_PROGRESS) {
@@ -49,16 +48,10 @@ export function getPlugins(plugins: Array<any>, production: boolean, pilet?: str
     );
   }
 
-  if (production && pilet) {
-    const name = process.env.BUILD_PCKG_NAME;
-    otherPlugins.push(new SheetPlugin(piletCss, name, pilet) as any);
-  }
-
   return plugins.concat(otherPlugins);
 }
 
-export function getRules(production: boolean): Array<RuleSetRule> {
-  const styleLoaders = getStyleLoaders(production);
+export function getRules(styleLoaders: Array<string>): Array<RuleSetRule> {
   const nodeModules = /node_modules/;
   const babelLoader = {
     loader: require.resolve('babel-loader'),

src/tooling/piral-cli-webpack5/src/webpack/pilet.ts

@@ -2,7 +2,7 @@ import type { PiletBuildHandler } from 'piral-cli';
 import * as TerserPlugin from 'terser-webpack-plugin';
 import * as CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
 import type { PiletSchemaVersion, SharedDependency } from 'piral-cli';
-import { getRules, getPlugins, extensions, getVariables, DefaultConfiguration } from './common';
+import { getRules, getPlugins, extensions, getVariables, DefaultConfiguration, getStyleLoaders } from './common';
 import { piletWebpackConfigEnhancer } from '../enhancers/pilet-webpack-config-enhancer';
 import { resolve } from 'path';
 import { runWebpack } from './bundler-run';
@@ -39,6 +39,8 @@ async function getConfig(
     variables: getVariables(),
   });
 
+  const styleLoaders = getStyleLoaders(true);
+
   return [
     {
       devtool: sourceMaps ? (develop ? 'cheap-module-source-map' : 'source-map') : false,
@@ -63,7 +65,7 @@ async function getConfig(
       },
 
       module: {
-        rules: getRules(production),
+        rules: getRules(styleLoaders),
       },
 
       optimization: {
@@ -85,7 +87,7 @@ async function getConfig(
         ],
       },
 
-      plugins: getPlugins([], production, entry),
+      plugins: getPlugins([], entry),
     },
     enhance,
   ];

src/tooling/piral-cli-webpack5/src/webpack/piral.ts

@@ -5,7 +5,7 @@ import * as CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
 import { getFreePort } from 'piral-cli/utils';
 import { resolve } from 'path';
 import { runWebpack } from './bundler-run';
-import { getRules, getPlugins, extensions, getVariables, DefaultConfiguration } from './common';
+import { getRules, getPlugins, extensions, getVariables, DefaultConfiguration, getStyleLoaders } from './common';
 import { html5EntryWebpackConfigEnhancer } from '../enhancers/html5-entry-webpack-config-enhancer';
 import { piralInstanceWebpackConfigEnhancer } from '../enhancers/piral-instance-webpack-config-enhancer';
 import { hmrWebpackConfigEnhancer } from '../enhancers/hmr-webpack-config-enhancer';
@@ -39,6 +39,8 @@ async function getConfig(
       }),
     ].reduceRight((acc, val) => val(acc), options);
 
+  const styleLoaders = getStyleLoaders(production);
+
   return [
     {
       devtool: sourceMaps ? (develop ? 'cheap-module-source-map' : 'source-map') : false,
@@ -59,7 +61,7 @@ async function getConfig(
       },
 
       module: {
-        rules: getRules(production),
+        rules: getRules(styleLoaders),
       },
 
       optimization: {
@@ -75,7 +77,7 @@ async function getConfig(
         ],
       },
 
-      plugins: getPlugins([], production),
+      plugins: getPlugins([]),
     },
     enhance,
   ];

src/tooling/piral-cli/src/common/http.ts

@@ -63,7 +63,7 @@ export interface PostFormResult {
   response?: object;
 }
 
-export type FormDataObj = Record<string, string | [Buffer, string]>;
+export type FormDataObj = Record<string, string | number | boolean | [Buffer, string]>;
 
 export function postForm(
   target: string,
@@ -80,10 +80,12 @@ export function postForm(
   Object.keys(formData).forEach((key) => {
     const value = formData[key];
 
-    if (typeof value === 'string') {
+    if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {
       form.append(key, value);
-    } else {
+    } else if (Array.isArray(value)) {
       form.append(key, value[0], value[1]);
+    } else {
+      // unknown value - skip for now
     }
   });
 

src/tooling/piral-cli/src/common/spec.ts

@@ -3,6 +3,7 @@ import { computeHash, computeIntegrity } from './hash';
 
 const checkV1 = /^\/\/\s*@pilet\s+v:1\s*\(([A-Za-z0-9\_\:\-]+)\)/;
 const checkV2 = /^\/\/\s*@pilet\s+v:2\s*(?:\(([A-Za-z0-9\_\:\-]+),\s*(.*)\))?/;
+const checkV3 = /^\/\/\s*@pilet\s+v:3\s*(?:\(([A-Za-z0-9\_\:\-]+),\s*(.*)\))?/;
 const isUrl = /^https?:\/\//;
 
 function getDependencies(deps: string, basePath: string) {
@@ -46,6 +47,14 @@ export function getPiletSpecMeta(target: string, basePath: string) {
         requireRef,
         dependencies: getDependencies(plainDependencies, basePath),
       };
+    } else if (checkV3.test(content)) {
+      // uses two arguments; requireRef and dependencies as JSON (required)
+      const [, requireRef, plainDependencies] = checkV3.exec(content);
+      return {
+        spec: 'v3',
+        requireRef,
+        dependencies: getDependencies(plainDependencies, basePath),
+      };
     } else {
       // uses no arguments
       return {

src/tooling/piral-cli/src/types/public.ts

@@ -219,7 +219,7 @@ export interface BundlerDefinition {
   buildPilet: BuildPiletBundlerDefinition;
 }
 
-export type PiletSchemaVersion = 'none' | 'v0' | 'v1' | 'v2';
+export type PiletSchemaVersion = 'none' | 'v0' | 'v1' | 'v2' | 'v3';
 
 export type SourceLanguage = 'js' | 'ts';