@nx/webpack 17.0.0-beta.1 → 17.0.0-beta.4

package/executors.json

@@ -1,21 +1,4 @@
 {
-  "builders": {
-    "webpack": {
-      "implementation": "./src/executors/webpack/compat",
-      "schema": "./src/executors/webpack/schema.json",
-      "description": "Run webpack build."
-    },
-    "dev-server": {
-      "implementation": "./src/executors/dev-server/compat",
-      "schema": "./src/executors/dev-server/schema.json",
-      "description": "Serve a web application."
-    },
-    "ssr-dev-server": {
-      "implementation": "./src/executors/ssr-dev-server/compat",
-      "schema": "./src/executors/ssr-dev-server/schema.json",
-      "description": "Serve a SSR application."
-    }
-  },
   "executors": {
     "webpack": {
       "implementation": "./src/executors/webpack/webpack.impl",

package/generators.json

@@ -1,21 +1,6 @@
 {
   "name": "Nx Webpack",
   "version": "0.1",
-  "schematics": {
-    "init": {
-      "factory": "./src/generators/init/init#webpackInitSchematic",
-      "schema": "./src/generators/init/schema.json",
-      "description": "Initialize the `@nrwl/webpack` plugin.",
-      "hidden": true
-    },
-    "configuration": {
-      "aliases": ["webpack-project"],
-      "factory": "./src/generators/configuration/configuration#compat",
-      "schema": "./src/generators/configuration/schema.json",
-      "description": "Add webpack configuration to a project.",
-      "hidden": true
-    }
-  },
   "generators": {
     "init": {
       "factory": "./src/generators/init/init#webpackInitGenerator",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/webpack",
-  "version": "17.0.0-beta.1",
+  "version": "17.0.0-beta.4",
   "private": false,
   "description": "The Nx Plugin for Webpack contains executors and generators that support building applications using Webpack.",
   "repository": {
@@ -22,8 +22,8 @@
     "url": "https://github.com/nrwl/nx/issues"
   },
   "homepage": "https://nx.dev",
-  "schematics": "./generators.json",
-  "builders": "./executors.json",
+  "generators": "./generators.json",
+  "executors": "./executors.json",
   "ng-update": {
     "requirements": {},
     "migrations": "./migrations.json"
@@ -52,8 +52,6 @@
     "sass-loader": "^12.2.0",
     "source-map-loader": "^3.0.0",
     "style-loader": "^3.3.0",
-    "stylus": "^0.59.0",
-    "stylus-loader": "^7.1.0",
     "terser-webpack-plugin": "^5.3.3",
     "ts-loader": "^9.3.1",
     "tsconfig-paths-webpack-plugin": "4.0.0",
@@ -62,9 +60,9 @@
     "webpack-dev-server": "^4.9.3",
     "webpack-node-externals": "^3.0.0",
     "webpack-subresource-integrity": "^5.1.0",
-    "@nx/devkit": "17.0.0-beta.1",
-    "@nx/js": "17.0.0-beta.1",
-    "@nrwl/webpack": "17.0.0-beta.1"
+    "@nx/devkit": "17.0.0-beta.4",
+    "@nx/js": "17.0.0-beta.4",
+    "@nrwl/webpack": "17.0.0-beta.4"
   },
   "publishConfig": {
     "access": "public"

package/src/executors/ssr-dev-server/ssr-dev-server.impl.js

@@ -15,7 +15,7 @@ async function* ssrDevServerExecutor(options, context) {
     let browserBuilt = false;
     let nodeStarted = false;
     const combined = (0, async_iterable_1.combineAsyncIterables)(runBrowser, runServer);
-    process.env['port'] = `${options.port}`;
+    process.env['PORT'] = `${options.port}`;
     for await (const output of combined) {
         if (!output.success)
             throw new Error('Could not build application');

package/src/executors/webpack/webpack.impl.js

@@ -12,13 +12,15 @@ const run_webpack_1 = require("./lib/run-webpack");
 const fs_1 = require("../../utils/fs");
 const custom_webpack_1 = require("../../utils/webpack/custom-webpack");
 const normalize_options_1 = require("./lib/normalize-options");
-async function getWebpackConfigs(options, context) {
+async function getWebpackConfigs(options, projectRoot, context) {
     if (options.isolatedConfig && !options.webpackConfig) {
         throw new Error(`Using "isolatedConfig" without a "webpackConfig" is not supported.`);
     }
     let customWebpack = null;
     if (options.webpackConfig) {
-        customWebpack = (0, custom_webpack_1.resolveCustomWebpackConfig)(options.webpackConfig, options.tsConfig);
+        customWebpack = (0, custom_webpack_1.resolveCustomWebpackConfig)(options.webpackConfig, options.tsConfig.startsWith(context.root)
+            ? options.tsConfig
+            : (0, path_1.join)(context.root, options.tsConfig));
         if (typeof customWebpack.then === 'function') {
             customWebpack = await customWebpack;
         }
@@ -76,7 +78,7 @@ async function* webpackExecutor(_options, context) {
         devkit_1.logger.warn((0, devkit_1.stripIndents) `The project ${context.projectName} is using the 'generatePackageJson' option which is deprecated for library projects. It should only be used for applications.
         For libraries, configure the project to use the '@nx/dependency-checks' ESLint rule instead (https://nx.dev/packages/eslint-plugin/documents/dependency-checks).`);
     }
-    const configs = await getWebpackConfigs(options, context);
+    const configs = await getWebpackConfigs(options, metadata.root, context);
     return yield* (0, rxjs_for_await_1.eachValueFrom)((0, rxjs_1.of)(configs).pipe((0, operators_1.mergeMap)((config) => (Array.isArray(config) ? (0, rxjs_1.from)(config) : (0, rxjs_1.of)(config))), 
     // Run build sequentially and bail when first one fails.
     (0, operators_1.mergeScan)((acc, config) => {

package/src/generators/configuration/configuration.d.ts

@@ -2,4 +2,3 @@ import type { Tree } from '@nx/devkit';
 import { ConfigurationGeneratorSchema } from './schema';
 export declare function configurationGenerator(tree: Tree, options: ConfigurationGeneratorSchema): Promise<import("@nx/devkit").GeneratorCallback>;
 export default configurationGenerator;
-export declare const compat: (generatorOptions: ConfigurationGeneratorSchema) => (tree: any, context: any) => Promise<any>;

package/src/generators/configuration/configuration.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.compat = exports.configurationGenerator = void 0;
+exports.configurationGenerator = void 0;
 const devkit_1 = require("@nx/devkit");
 const init_1 = require("../init/init");
 async function configurationGenerator(tree, options) {
@@ -120,4 +120,3 @@ function addServeTarget(tree, options) {
     });
 }
 exports.default = configurationGenerator;
-exports.compat = (0, devkit_1.convertNxGenerator)(configurationGenerator);

package/src/generators/init/init.d.ts

@@ -2,4 +2,3 @@ import { GeneratorCallback, Tree } from '@nx/devkit';
 import { Schema } from './schema';
 export declare function webpackInitGenerator(tree: Tree, schema: Schema): Promise<GeneratorCallback>;
 export default webpackInitGenerator;
-export declare const webpackInitSchematic: (generatorOptions: Schema) => (tree: any, context: any) => Promise<any>;

package/src/generators/init/init.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.webpackInitSchematic = exports.webpackInitGenerator = void 0;
+exports.webpackInitGenerator = void 0;
 const devkit_1 = require("@nx/devkit");
 const add_swc_dependencies_1 = require("@nx/js/src/utils/swc/add-swc-dependencies");
 const versions_1 = require("../../utils/versions");
@@ -33,4 +33,3 @@ async function webpackInitGenerator(tree, schema) {
 }
 exports.webpackInitGenerator = webpackInitGenerator;
 exports.default = webpackInitGenerator;
-exports.webpackInitSchematic = (0, devkit_1.convertNxGenerator)(webpackInitGenerator);

package/src/utils/get-css-module-local-ident.js

@@ -5,7 +5,7 @@ const path_1 = require("path");
 const loader_utils_1 = require("loader-utils");
 function getCSSModuleLocalIdent(ctx, localIdentName, localName, options) {
     // Use the filename or folder name, based on some uses the index.js / index.module.(css|scss|sass) project style
-    const fileNameOrFolder = ctx.resourcePath.match(/index\.module\.(css|scss|sass|styl)$/)
+    const fileNameOrFolder = ctx.resourcePath.match(/index\.module\.(css|scss|sass)$/)
         ? '[folder]'
         : '[name]';
     // Create a hash based on a the file location and class name. Will be unique across a project, and close to globally unique.

package/src/utils/module-federation/models/index.d.ts

@@ -13,7 +13,7 @@ export type SharedWorkspaceLibraryConfig = {
     getLibraries: (projectRoot: string, eager?: boolean) => Record<string, SharedLibraryConfig>;
     getReplacementPlugin: () => NormalModuleReplacementPlugin;
 };
-export type Remotes = string[] | [remoteName: string, remoteUrl: string][];
+export type Remotes = Array<string | [remoteName: string, remoteUrl: string]>;
 export interface SharedLibraryConfig {
     singleton?: boolean;
     strictVersion?: boolean;

package/src/utils/module-federation/remotes.js

@@ -37,7 +37,14 @@ function handleArrayRemote(remote, remoteEntryExt, isRemoteGlobal) {
     const globalPrefix = isRemoteGlobal
         ? `${remoteName.replace(/-/g, '_')}@`
         : '';
-    return `${globalPrefix}${baseRemote}/remoteEntry.${remoteEntryExt}`;
+    // if the remote is defined with anything other than http then we assume it's a promise based remote
+    // In that case we should use what the user provides as the remote location
+    if (remoteLocation.startsWith('http')) {
+        return `${globalPrefix}${baseRemote}/remoteEntry.${remoteEntryExt}`;
+    }
+    else {
+        return remoteLocation;
+    }
 }
 // Helper function to deal with remotes that are strings
 function handleStringRemote(remote, determineRemoteUrl, isRemoteGlobal) {

package/src/utils/webpack/custom-webpack.js

@@ -3,15 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.isRegistered = exports.resolveCustomWebpackConfig = void 0;
 const internal_1 = require("@nx/js/src/internal");
 function resolveCustomWebpackConfig(path, tsConfig) {
+    // Don't transpile non-TS files. This prevents workspaces libs from being registered via tsconfig-paths.
+    // There's an issue here with Nx workspace where loading plugins from source (via tsconfig-paths) can lead to errors.
+    if (!/\.(ts|mts|cts)$/.test(path)) {
+        return require(path);
+    }
     const cleanupTranspiler = (0, internal_1.registerTsProject)(tsConfig);
-    const customWebpackConfig = require(path);
+    const maybeCustomWebpackConfig = require(path);
     cleanupTranspiler();
     // If the user provides a configuration in TS file
-    // then there are 2 cases for exporing an object. The first one is:
+    // then there are 3 cases for exporing an object. The first one is:
     // `module.exports = { ... }`. And the second one is:
     // `export default { ... }`. The ESM format is compiled into:
     // `{ default: { ... } }`
-    return customWebpackConfig.default || customWebpackConfig;
+    // There is also a case of
+    // `{ default: { default: { ... } }`
+    const customWebpackConfig = 'default' in maybeCustomWebpackConfig
+        ? 'default' in maybeCustomWebpackConfig.default
+            ? maybeCustomWebpackConfig.default.default
+            : maybeCustomWebpackConfig.default
+        : maybeCustomWebpackConfig;
+    return customWebpackConfig;
 }
 exports.resolveCustomWebpackConfig = resolveCustomWebpackConfig;
 function isRegistered() {

package/src/utils/with-web.js

@@ -57,7 +57,7 @@ function withWeb(pluginOptions = {}) {
         ];
         if (stylesOptimization) {
             minimizer.push(new CssMinimizerPlugin({
-                test: /\.(?:css|scss|sass|less|styl)$/,
+                test: /\.(?:css|scss|sass|less)$/,
             }));
         }
         if (!pluginOptions.ssr) {
@@ -131,21 +131,6 @@ function withWeb(pluginOptions = {}) {
                     },
                 ],
             },
-            {
-                test: /\.module\.styl$/,
-                exclude: globalStylePaths,
-                use: [
-                    ...getCommonLoadersForCssModules(mergedOptions, includePaths),
-                    {
-                        loader: require.resolve('stylus-loader'),
-                        options: {
-                            stylusOptions: {
-                                include: includePaths,
-                            },
-                        },
-                    },
-                ],
-            },
         ];
         const globalCssRules = [
             {
@@ -190,22 +175,6 @@ function withWeb(pluginOptions = {}) {
                     },
                 ],
             },
-            {
-                test: /\.styl$/,
-                exclude: globalStylePaths,
-                use: [
-                    ...getCommonLoadersForGlobalCss(mergedOptions, includePaths),
-                    {
-                        loader: require.resolve('stylus-loader'),
-                        options: {
-                            sourceMap: !!mergedOptions.sourceMap,
-                            stylusOptions: {
-                                include: includePaths,
-                            },
-                        },
-                    },
-                ],
-            },
         ];
         const globalStyleRules = [
             {
@@ -250,26 +219,10 @@ function withWeb(pluginOptions = {}) {
                     },
                 ],
             },
-            {
-                test: /\.styl$/,
-                include: globalStylePaths,
-                use: [
-                    ...getCommonLoadersForGlobalStyle(mergedOptions, includePaths),
-                    {
-                        loader: require.resolve('stylus-loader'),
-                        options: {
-                            sourceMap: !!mergedOptions.sourceMap,
-                            stylusOptions: {
-                                include: includePaths,
-                            },
-                        },
-                    },
-                ],
-            },
         ];
         const rules = [
             {
-                test: /\.css$|\.scss$|\.sass$|\.less$|\.styl$/,
+                test: /\.css$|\.scss$|\.sass$|\.less$/,
                 oneOf: [...cssModuleRules, ...globalCssRules, ...globalStyleRules],
             },
         ];

package/src/executors/dev-server/compat.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;

package/src/executors/dev-server/compat.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const devkit_1 = require("@nx/devkit");
-const dev_server_impl_1 = require("./dev-server.impl");
-exports.default = (0, devkit_1.convertNxExecutor)(dev_server_impl_1.default);

package/src/executors/ssr-dev-server/compat.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;

package/src/executors/ssr-dev-server/compat.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const devkit_1 = require("@nx/devkit");
-const ssr_dev_server_impl_1 = require("./ssr-dev-server.impl");
-exports.default = (0, devkit_1.convertNxExecutor)(ssr_dev_server_impl_1.default);

package/src/executors/webpack/compat.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;

package/src/executors/webpack/compat.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const devkit_1 = require("@nx/devkit");
-const webpack_impl_1 = require("./webpack.impl");
-exports.default = (0, devkit_1.convertNxExecutor)(webpack_impl_1.webpackExecutor);