@plaudit/webpack-extensions 0.0.9 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/build/wordpress-scripts-wrapper/wordpressWebpackEntrypointWrapper.d.ts +6 -1
  2. package/build/wordpress-scripts-wrapper/wordpressWebpackEntrypointWrapper.js +59 -6
  3. package/package.json +63 -14
package/build/wordpress-scripts-wrapper/wordpressWebpackEntrypointWrapper.d.ts CHANGED
@@ -1,2 +1,7 @@
1
1
  import type { Configuration } from "webpack";
2
- export default function (config: Configuration): typeof config;
2
+ export interface PlauditWordpressWebpackConfig {
3
+ legacyPostcssPlugins: boolean;
4
+ variables: Record<string, any>;
5
+ src: string;
6
+ }
7
+ export default function (config: Partial<PlauditWordpressWebpackConfig>, webpackConfig?: Configuration): Configuration;
package/build/wordpress-scripts-wrapper/wordpressWebpackEntrypointWrapper.js CHANGED
@@ -18,17 +18,70 @@ function addEntryPointWithFilter(entrypoints, entrypoint, mapper = (entrypoint)
18
18
  entrypoints.push(mapper(entrypoint));
19
19
  }
20
20
  }
21
- function default_1(config) {
22
- (config.plugins ?? (config.plugins = [])).push(new fork_ts_checker_webpack_plugin_1.default({
21
+ function default_1(config, webpackConfig = require("@wordpress/scripts/config/webpack.config")) {
22
+ const { legacyPostcssPlugins = false, variables = require("./variables.js"), // TODO: There must be a better way to handle this...
23
+ src = process.env['WP_SRC_DIRECTORY'] || 'src' } = config;
24
+ (webpackConfig.plugins ?? (webpackConfig.plugins = [])).push(new fork_ts_checker_webpack_plugin_1.default({
23
25
  typescript: {
24
26
  diagnosticOptions: {
25
27
  semantic: true,
26
28
  syntactic: true,
27
29
  },
28
30
  },
29
- }), new webpack_remove_empty_scripts_1.default({ stage: webpack_remove_empty_scripts_1.default.STAGE_AFTER_PROCESS_PLUGINS }), new BlockJSONStyleRemappingPlugin_1.default(), new AdditionalDependencyInjectorPlugin_1.default(), new copy_webpack_plugin_1.default({ patterns: [{ from: '**/*.(twig|svg)', context: process.env['WP_SRC_DIRECTORY'] || 'src', noErrorOnMissing: true }] }));
30
- const baseEntry = config.entry;
31
- config.entry = () => {
31
+ }), new webpack_remove_empty_scripts_1.default({ stage: webpack_remove_empty_scripts_1.default.STAGE_AFTER_PROCESS_PLUGINS }), new BlockJSONStyleRemappingPlugin_1.default(), new AdditionalDependencyInjectorPlugin_1.default(), new copy_webpack_plugin_1.default({ patterns: [{ from: '**/*.(twig|svg)', context: src, noErrorOnMissing: true }] }));
32
+ if (webpackConfig.module?.rules) {
33
+ const postcssLoader = require.resolve('postcss-loader');
34
+ // Options: calc
35
+ const calcOptions = { precision: 4, mediaQueries: true, selectors: true };
36
+ // Options: autoprefixerOptions
37
+ const autoprefixerOptions = { grid: "autoplace" };
38
+ const postcssConfig = {
39
+ plugins: [
40
+ require("postcss-import")(),
41
+ require("@plaudit/postcss-silent-extend")(),
42
+ require("postcss-mixins")(),
43
+ require("@plaudit/postcss-variables")(variables),
44
+ ...(legacyPostcssPlugins ? [
45
+ require("postcss-quantity-queries")(),
46
+ require("postcss-short-position")(),
47
+ require("postcss-short-size")(),
48
+ require("postcss-short-spacing")(),
49
+ require("postcss-fallback")() // Legacy
50
+ ] : []),
51
+ require("postcss-property-lookup")({ logLevel: "warn" }),
52
+ require("@plaudit/postcss-strip-units")(),
53
+ require("postcss-media-minmax")(),
54
+ require("postcss-inline-svg")(),
55
+ require("postcss-nested")(),
56
+ require("postcss-calc")(calcOptions),
57
+ require("@plaudit/postcss-color-function")(),
58
+ require("autoprefixer")(autoprefixerOptions),
59
+ require("postcss-reporter")({ clearReportedMessages: true }) // OnceExit
60
+ ]
61
+ };
62
+ //TODO: Add CSSNano
63
+ for (const rule of webpackConfig.module.rules) {
64
+ if (typeof rule === 'object' && Array.isArray(rule.use)) {
65
+ for (const useItem of rule.use) {
66
+ if (typeof useItem === 'object' && typeof useItem.options === 'object') {
67
+ if (useItem.options["sourceMap"] === false) {
68
+ useItem.options["sourceMap"] = true;
69
+ }
70
+ if (useItem.loader === postcssLoader) {
71
+ if (useItem.options["postcssOptions"]) {
72
+ useItem.options["postcssOptions"] = { ...useItem.options["postcssOptions"], ...postcssConfig, sourceMap: true };
73
+ }
74
+ else {
75
+ useItem.options["postcssOptions"] = { ...postcssConfig, sourceMap: true };
76
+ }
77
+ }
78
+ }
79
+ }
80
+ }
81
+ }
82
+ }
83
+ const baseEntry = webpackConfig.entry;
84
+ webpackConfig.entry = () => {
32
85
  const srcDir = process.env['WP_SRC_DIRECTORY'] || 'src';
33
86
  const srcRoot = node_path_1.default.join(process.cwd(), srcDir);
34
87
  const entrypoints = node_fs_1.default.readdirSync(srcRoot, 'utf8')
@@ -67,6 +120,6 @@ function default_1(config) {
67
120
  const firstPassBaseEntries = typeof baseEntry === 'function' ? baseEntry() : baseEntry;
68
121
  return firstPassBaseEntries instanceof Promise ? firstPassBaseEntries.then(convertEntrypointsToObject) : convertEntrypointsToObject();
69
122
  };
70
- return config;
123
+ return webpackConfig;
71
124
  }
72
125
  exports.default = default_1;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@plaudit/webpack-extensions",
3
- "version": "0.0.9",
3
+ "version": "0.0.11",
4
4
  "scripts": {
5
5
  "prepublishOnly": "rm -rf build && mkdir build && tsc",
6
6
  "build": "tsc",
@@ -13,28 +13,77 @@
13
13
  "./wordpress-scripts-wrapper": "./build/wordpress-scripts-wrapper.js"
14
14
  },
15
15
  "devDependencies": {
16
- "@types/node": "^18.15.11",
16
+ "@types/node": "^18.15.12",
17
+ "@types/webpack": "^5.28.1",
17
18
  "@types/webpack-sources": "^3.2.0",
18
- "copy-webpack-plugin": "^11.0.0",
19
- "fork-ts-checker-webpack-plugin": "^8.0.0",
20
- "typescript": "^5.0.4",
21
- "webpack": "^5.79.0",
22
- "webpack-remove-empty-scripts": "^1.0.3"
19
+ "postcss-loader": "^7.2.4",
20
+ "postcss-load-config": "^4.0.1",
21
+ "typescript": "^5.0.4"
23
22
  },
24
23
  "dependencies": {
24
+ "@plaudit/postcss-color-function": "^5.0.0",
25
+ "@plaudit/postcss-silent-extend": "^3.0.0",
26
+ "@plaudit/postcss-strip-units": "^3.0.0",
27
+ "@plaudit/postcss-variables": "^1.0.0",
28
+ "@wordpress/scripts": "^26.2.0",
29
+ "autoprefixer": "^10.4.14",
30
+ "clean-webpack-plugin": "^4.0.0",
31
+ "copy-webpack-plugin": "^11.0.0",
32
+ "eslint": "^8.38.0",
33
+ "eslint-plugin-jsdoc": "^43.0.3",
34
+ "fork-ts-checker-webpack-plugin": "^8.0.0",
35
+ "postcss": "^8.4.23",
36
+ "postcss-calc": "^8.2.4",
37
+ "postcss-extend": "^1.0.5",
38
+ "postcss-fallback": "^0.1.0",
39
+ "postcss-import": "^15.1.0",
40
+ "postcss-inline-svg": "^6.0.0",
41
+ "postcss-media-minmax": "^5.0.0",
42
+ "postcss-nested": "^6.0.1",
43
+ "postcss-property-lookup": "^3.0.0",
44
+ "postcss-quantity-queries": "^0.5.0",
45
+ "postcss-reporter": "^7.0.5",
46
+ "postcss-short-position": "^4.0.1",
47
+ "postcss-short-size": "^4.0.0",
48
+ "postcss-short-spacing": "^4.0.0",
49
+ "react": "^18.2.0",
50
+ "react-dom": "^18.2.0",
51
+ "ts-node": "^10.9.1",
52
+ "webpack": "^5.80.0",
53
+ "webpack-remove-empty-scripts": "^1.0.3",
54
+ "webpack-sources": "^3.2.3"
25
55
  },
26
56
  "peerDependencies": {
27
- "@wordpress/dependency-extraction-webpack-plugin": "^4.13.0",
57
+ "@plaudit/postcss-color-function": "^5.0.0",
58
+ "@plaudit/postcss-silent-extend": "^3.0.0",
59
+ "@plaudit/postcss-strip-units": "^3.0.0",
60
+ "@plaudit/postcss-variables": "^1.0.0",
61
+ "@wordpress/scripts": "^26.2.0",
62
+ "autoprefixer": "^10.4.14",
28
63
  "clean-webpack-plugin": "^4.0.0",
29
64
  "copy-webpack-plugin": "^11.0.0",
30
- "eslint-plugin-jsdoc": "^39.6.4",
65
+ "eslint": "^8.38.0",
66
+ "eslint-plugin-jsdoc": "^43.0.3",
31
67
  "fork-ts-checker-webpack-plugin": "^8.0.0",
32
- "webpack": "^5.79.0",
68
+ "postcss": "^8.4.23",
69
+ "postcss-calc": "^8.2.4",
70
+ "postcss-extend": "^1.0.5",
71
+ "postcss-fallback": "^0.1.0",
72
+ "postcss-import": "^15.1.0",
73
+ "postcss-inline-svg": "^6.0.0",
74
+ "postcss-media-minmax": "^5.0.0",
75
+ "postcss-nested": "^6.0.1",
76
+ "postcss-property-lookup": "^3.0.0",
77
+ "postcss-quantity-queries": "^0.5.0",
78
+ "postcss-reporter": "^7.0.5",
79
+ "postcss-short-position": "^4.0.1",
80
+ "postcss-short-size": "^4.0.0",
81
+ "postcss-short-spacing": "^4.0.0",
82
+ "react": "^18.2.0",
83
+ "react-dom": "^18.2.0",
84
+ "ts-node": "^10.9.1",
85
+ "webpack": "^5.80.0",
33
86
  "webpack-remove-empty-scripts": "^1.0.3",
34
87
  "webpack-sources": "^3.2.3"
35
- },
36
- "resolutions": {
37
- "eslint-plugin-jsdoc": "^39.6.4",
38
- "clean-webpack-plugin": "^4.0.0"
39
88
  }
40
89
  }