diff --git a/examples/webpack-minimal/webpack.config.ts b/examples/webpack-minimal/webpack.config.ts index c6fc0514..3fd650a0 100644 --- a/examples/webpack-minimal/webpack.config.ts +++ b/examples/webpack-minimal/webpack.config.ts @@ -4,53 +4,62 @@ import path from 'path'; import HtmlWebpackPlugin from 'html-webpack-plugin'; import WorkboxWebpackPlugin from 'workbox-webpack-plugin'; import { Configuration } from 'webpack'; -import { tsImport } from 'tsx/esm/api' +import * as tsx from 'tsx/cjs/api' + +const {default: UnpluginTypia} = tsx.require('../../packages/unplugin-typia/src/webpack.ts', __filename) const isProduction = process.env.NODE_ENV == 'production'; -module.exports = async () => { - /** we use tsImport because of development. However, in real-world projecct, just use `import` instead */ - // const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack'); - const { default: UnpluginTypia } = await tsImport('@ryoppippi/unplugin-typia/webpack', __dirname); - return { - mode: isProduction ? 'production' : 'development', - entry: './src/index.ts', - output: { - path: path.resolve(__dirname, 'dist'), - }, - devServer: { - open: true, - host: 'localhost', - }, - plugins: [ - new HtmlWebpackPlugin({ - template: 'index.html', - }), - UnpluginTypia(), - isProduction && new WorkboxWebpackPlugin.GenerateSW(), - // Add your plugins here - // Learn more about plugins from https://webpack.js.org/configuration/plugins/ - ], - module: { - rules: [ - { - test: /\.(ts|tsx)$/i, - loader: 'ts-loader', - exclude: ['/node_modules/'], - }, - { - test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i, - type: 'asset', - }, +const config: Configuration = { + entry: './src/index.ts', + output: { + path: path.resolve(__dirname, 'dist'), + }, + devServer: { + open: true, + host: 'localhost', + }, + plugins: [ + new HtmlWebpackPlugin({ + template: 'index.html', + }), + UnpluginTypia() + // Add your plugins here + // Learn more about plugins from https://webpack.js.org/configuration/plugins/ + ], + module: { + rules: [ + { + test: /\.(ts|tsx)$/i, + loader: 'ts-loader', + exclude: ['/node_modules/'], + }, + { + test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i, + type: 'asset', + }, - // Add your rules for custom modules here - // Learn more about loaders from https://webpack.js.org/loaders/ - ], - }, - resolve: { - extensions: ['.tsx', '.ts', '.jsx', '.js', '...'], - }, - } as const satisfies Configuration; + // Add your rules for custom modules here + // Learn more about loaders from https://webpack.js.org/loaders/ + ], + }, + resolve: { + extensions: ['.tsx', '.ts', '.jsx', '.js', '...'], + }, }; +module.exports = () => { + if (isProduction) { + config.mode = 'production'; + + if (config.plugins == null) { + config.plugins = [] + } + config.plugins.push(new WorkboxWebpackPlugin.GenerateSW()); + + } else { + config.mode = 'development'; + } + return config; +}; diff --git a/packages/unplugin-typia/README.md b/packages/unplugin-typia/README.md index 457381de..d6d60949 100644 --- a/packages/unplugin-typia/README.md +++ b/packages/unplugin-typia/README.md @@ -196,22 +196,28 @@ Examples: > ⚠️ Note: Currently, this plugin works only with 'esm' target. -> If you want to use 'cjs', use dynamic import. - +> If you want to use 'cjs' target on Node < 20.17.0 , please use with [`jiti`](https://github.com/unjs/jiti). +> If you want to use 'cjs' target on Node >= 20.17.0, please use with `require` and enable [`--experimental-require-modules` flag](https://github.com/nodejs/node/pull/51977). > If you want to use 'esm' target, don't worry! You can use this plugin without any additional setup. +```sh +npm install jiti +``` + ```js // webpack.config.js -module.exports = async () => { - const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack'); - return { - plugins: [ - new UnpluginTypia({ - // options - }), - ], - }; +// if you use Node < 20.17.0 +const jiti = require('jiti')(__filename); +const { default: UnpluginTypia } = jiti('@ryoppippi/unplugin-typia/webpack'); + +// if you use Node >= 20.17.0 +// const { default: UnpluginTypia } = require("@ryoppippi/unplugin-typia/webpack"); + +module.exports = { + plugins: [ + UnpluginTypia({ /* options */ }), + ], }; ``` diff --git a/packages/unplugin-typia/src/webpack.ts b/packages/unplugin-typia/src/webpack.ts index a57ae25a..d1b5ce53 100644 --- a/packages/unplugin-typia/src/webpack.ts +++ b/packages/unplugin-typia/src/webpack.ts @@ -11,7 +11,8 @@ import unplugin from './core/index.js'; * * Currently, this plugin works only with 'esm' target. * - * If you want to use 'cjs' use dynamic import + * If you want to use 'cjs' target on Node < 20.17.0 , please use with [`jiti`](https://github.com/unjs/jiti). + * If you want to use 'cjs' target on Node >= 20.17.0, please use with `require` and enable [`--experimental-require-modules` flag](https://github.com/nodejs/node/pull/51977). * If you want to use 'esm' target, don't worry! You can use this plugin without any additional setup. * * Refer this issue https://github.com/samchon/typia/issues/1094 @@ -20,16 +21,16 @@ import unplugin from './core/index.js'; * ```js * // webpack.config.js * - * module.exports = async () => { - * const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack'); - * return { - * plugins: [ - * new UnpluginTypia({ - * // options - * }), - * ], - * }; - * }; + * // if you use Node < 20.17.0 + * const jiti = require("jiti")(__filename); + * const { default: UnpluginTypia } = jiti("@ryoppippi/unplugin-typia/webpack"); + * + * // if you use Node >= 20.17.0 + * const { default: UnpluginTypia } = require("@ryoppippi/unplugin-typia/webpack"); + * + * module.exports = { + * plugins: [UnpluginTypia({ /* your config *\/ })], + * } * ``` * */