Merge branch 'release/4.0.0-alpha.3'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/webpack-config-root",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "private": true,
   "type": "commonjs",
   "workspaces": [
@@ -13,9 +13,9 @@
     "demo:build": "npm run build -w @studiometa/webpack-config-demo"
   },
   "devDependencies": {
-    "@studiometa/eslint-config": "^3.0.3",
+    "@studiometa/eslint-config": "^3.0.5",
     "@studiometa/prettier-config": "^2.1.1",
-    "eslint": "^8.20.0",
+    "eslint": "^8.21.0",
     "prettier": "^2.7.1"
   }
 }

packages/demo/.eslintrc

@@ -5,7 +5,8 @@
     "import/extensions": ["error", "always", { "ignorePackages": false }],
     "import/no-extraneous-dependencies": "off",
     "no-unused-vars": "off",
-    "import/no-duplicates": ["error", {"considerQueryString": true}]
-    "no-console": "off"
+    "import/no-duplicates": ["error", {"considerQueryString": true}],
+    "no-console": "off",
+    "require-jsdoc": "off"
   }
 }

packages/demo/package.json

@@ -1,24 +1,24 @@
 {
   "name": "@studiometa/webpack-config-demo",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "private": true,
   "type": "module",
   "scripts": {
     "dev": "node ../webpack-config/bin/cli.js dev",
     "build": "node ../webpack-config/bin/cli.js build"
   },
   "devDependencies": {
-    "@studiometa/eslint-config": "^3.0.3",
+    "@studiometa/eslint-config": "^3.0.4",
     "@studiometa/prettier-config": "^2.1.1",
     "@studiometa/stylelint-config": "^2.0.0",
     "@studiometa/webpack-config": "file:../webpack-config",
-    "eslint": "^8.20.0",
+    "eslint": "^8.21.0",
     "prettier": "^2.7.1",
     "stylelint": "^13.13.1",
-    "tailwindcss": "^3.1.6"
+    "tailwindcss": "^3.1.8"
   },
   "dependencies": {
-    "@studiometa/js-toolkit": "^2.4.1",
+    "@studiometa/js-toolkit": "^2.4.3",
     "@studiometa/ui": "^0.2.10",
     "vue": "^3.2.37"
   }

packages/demo/src/js/components/Component.ts

@@ -0,0 +1,30 @@
+import { Base } from '@studiometa/js-toolkit';
+import type { BaseTypeParameter } from '@studiometa/js-toolkit';
+import './Component.scss';
+import type ComponentFoo from '../foo/Component.js';
+
+interface ComponentInterface extends BaseTypeParameter {
+  $children: {
+    ComponentFoo: Promise<ComponentFoo>;
+  };
+  $refs: {
+    btn: HTMLButtonElement;
+  };
+}
+
+export default class Component<
+  T extends BaseTypeParameter = BaseTypeParameter
+> extends Base<ComponentInterface> {
+  static config = {
+    name: 'Component',
+    components: {
+      ComponentFoo: () => import('../foo/Component.js'),
+    },
+  };
+
+  async mounted() {
+    const foo = await this.$children.ComponentFoo[0];
+    foo.$options.foo;
+    foo.$refs.btn;
+  }
+}

packages/demo/src/js/foo/Component.ts

@@ -0,0 +1,28 @@
+import { Base } from '@studiometa/js-toolkit';
+import type { BaseTypeParameter } from '@studiometa/js-toolkit';
+
+interface ComponentInterface extends BaseTypeParameter {
+  $options: {
+    foo: boolean;
+  }
+  $refs: {
+    btn: HTMLButtonElement
+  }
+};
+
+export default class Component<T extends BaseTypeParameter = BaseTypeParameter> extends Base<T & ComponentInterface> {
+  /**
+   * Config.
+   */
+  static config = {
+    name: 'Component',
+    options: {
+      foo: Boolean,
+    },
+  };
+
+  mounted() {
+    this.$options.foo;
+    this.$refs.btn;
+  }
+}

packages/demo/src/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "include": [
+    "src/js/**/*.js",
+    "src/js/**/*.ts"
+  ]
+}

packages/preset-vue-2/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/webpack-config-preset-vue-2",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "publishConfig": {
     "access": "public"
   },

packages/preset-vue-3/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/webpack-config-preset-vue-3",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "publishConfig": {
     "access": "public"
   },

packages/webpack-config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/webpack-config",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "description": "A basic webpack config",
   "type": "module",
   "main": "src/index.js",
@@ -46,9 +46,9 @@
   },
   "homepage": "https://github.com/studiometa/webpack-config#readme",
   "devDependencies": {
-    "@studiometa/eslint-config": "^3.0.3",
+    "@studiometa/eslint-config": "^3.0.4",
     "@studiometa/prettier-config": "^2.1.1",
-    "eslint": "^8.20.0",
+    "eslint": "^8.21.0",
     "prettier": "^2.7.1",
     "stylelint": "^13.13.1"
   },
@@ -61,21 +61,22 @@
     "stylelint": "^13.13.1 || ^14.0.0"
   },
   "dependencies": {
-    "@babel/plugin-transform-runtime": "^7.18.9",
-    "@babel/preset-env": "^7.18.9",
+    "@babel/plugin-transform-runtime": "^7.18.10",
+    "@babel/preset-env": "^7.18.10",
     "@soda/friendly-errors-webpack-plugin": "^1.8.1",
     "@types/browser-sync": "^2.26.3",
     "@vue/compiler-sfc": "^3.2.37",
-    "autoprefixer": "^10.4.7",
+    "autoprefixer": "^10.4.8",
     "babel-loader": "^8.2.5",
     "browser-sync": "^2.27.10",
     "cac": "^6.7.12",
     "chalk": "^5.0.1",
     "common-dir": "^3.0.1",
-    "core-js": "^3.24.0",
+    "core-js": "^3.24.1",
     "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^4.0.0",
     "dotenv": "^16.0.1",
+    "esbuild": "^0.15.5",
     "esbuild-loader": "^2.19.0",
     "eslint-webpack-plugin": "^3.2.0",
     "filemanager-webpack-plugin": "^7.0.0",
@@ -86,7 +87,7 @@
     "lodash.merge": "^4.6.2",
     "mini-css-extract-plugin": "^2.6.1",
     "param-case": "^3.0.4",
-    "postcss": "^8.4.14",
+    "postcss": "^8.4.16",
     "postcss-loader": "^7.0.1",
     "postcss-preset-env": "^7.7.2",
     "raw-loader": "^4.0.2",

packages/webpack-config/src/webpack.base.config.js

@@ -45,6 +45,7 @@ export default async (config, options = {}) => {
   const esbuild = {
     loader: 'esbuild-loader',
     options: {
+      loader: 'ts',
       target: isDev ? 'es2020' : 'es2015',
       format: 'esm',
     },
@@ -118,7 +119,7 @@ export default async (config, options = {}) => {
           type: 'asset/source',
         },
         {
-          test: /\.m?js$/,
+          test: /\.m?(j|t)s$/,
           // Exclude all but packages from the `@studiometa/` namespace
           exclude: [/node_modules[\\/](?!@studiometa[\\/]).*/],
           type: 'javascript/auto',
@@ -163,7 +164,11 @@ export default async (config, options = {}) => {
       ],
     },
     resolve: {
-      extensions: ['.mjs', '.js', '.json'],
+      extensions: ['.mjs', '.js', '.json', '.ts'],
+      extensionAlias: {
+        '.js': ['.ts', '.js'],
+        '.mjs': ['.mts', '.mjs'],
+      },
       modules: [
         'node_modules',
         path.join(new URL(path.dirname(import.meta.url)).pathname, '..', 'node_modules'),
@@ -218,11 +223,14 @@ export default async (config, options = {}) => {
         new TerserPlugin({
           parallel: true,
           extractComments: true,
+          minify: TerserPlugin.esbuildMinify,
           terserOptions: {
             module: isModern,
           },
         }),
-        new CssMinimizerPlugin(),
+        new CssMinimizerPlugin({
+          minify: CssMinimizerPlugin.esbuildMinify,
+        }),
       ],
       runtimeChunk: {
         name: 'manifest',