create-packer 1.34.3 → 1.34.5

package/template/web-app/react-webpack/shared/tools/componentInstance.tsx

@@ -1,78 +1,78 @@
-import {
-    forwardRef,
-    ForwardRefExoticComponent,
-    FunctionComponent,
-    PropsWithChildren,
-    PropsWithoutRef,
-    RefAttributes,
-    useImperativeHandle,
-    useRef,
-    useState
-} from 'react'
-import { createRoot } from 'react-dom/client'
-
-const instanceMap: Record<string, { pending: Promise<any>; instance: any }> = {}
-
-export interface refsType<P> {
-    $setProps: (newProps: P) => void
-    $updateProps: (newProps: Partial<P>) => void
-}
-
-export function create(Context?: FunctionComponent<PropsWithChildren<any>>) {
-    return async function <P extends Record<string, any>, Refs extends Record<string, any>>(
-        key: string,
-        Component: ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<Refs>>,
-        props?: P
-    ) {
-        let current = instanceMap[key]
-        if (!current) {
-            const div = document.createElement('div')
-            document.body.appendChild(div)
-            const ApiComponent = forwardRef<Refs & refsType<P>>((__, refs) => {
-                const ref = useRef<Refs>(null)
-                const [state, setState] = useState<Partial<P>>(props || {})
-
-                useImperativeHandle(refs, () => {
-                    return {
-                        $setProps: newProps => {
-                            setState(() => newProps)
-                        },
-                        $updateProps: newProps => {
-                            if (newProps) {
-                                setState(state => ({ ...state, ...newProps }))
-                            }
-                        },
-                        ...ref.current
-                    } as Refs & refsType<P>
-                })
-                if (Context) {
-                    return (
-                        <Context>
-                            <Component ref={ref} {...(state as any)} />
-                        </Context>
-                    )
-                }
-                return <Component ref={ref} {...(state as any)} />
-            })
-            current = instanceMap[key] = {
-                instance: void 0,
-                pending: new Promise<void>(resolve => {
-                    createRoot(div).render(
-                        <ApiComponent
-                            ref={instance => {
-                                current.instance = instanceMap[key].instance = instance!
-                                resolve()
-                            }}
-                        />
-                    )
-                })
-            }
-        }
-        await current.pending
-        props && current.instance.$setProps(props)
-        // Delay return to avoid sync issue
-        // ------------------------------------------------------------------------
-        await new Promise(resolve => setTimeout(resolve))
-        return current.instance as Refs & refsType<P>
-    }
-}
+import {
+    forwardRef,
+    ForwardRefExoticComponent,
+    FunctionComponent,
+    PropsWithChildren,
+    PropsWithoutRef,
+    RefAttributes,
+    useImperativeHandle,
+    useRef,
+    useState
+} from 'react'
+import { createRoot } from 'react-dom/client'
+
+const instanceMap: Record<string, { pending: Promise<any>; instance: any }> = {}
+
+export interface refsType<P> {
+    $setProps: (newProps: P) => void
+    $updateProps: (newProps: Partial<P>) => void
+}
+
+export function create(Context?: FunctionComponent<PropsWithChildren<any>>) {
+    return async function <P extends Record<string, any>, Refs extends Record<string, any>>(
+        key: string,
+        Component: ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<Refs>>,
+        props?: P
+    ) {
+        let current = instanceMap[key]
+        if (!current) {
+            const div = document.createElement('div')
+            document.body.appendChild(div)
+            const ApiComponent = forwardRef<Refs & refsType<P>>((__, refs) => {
+                const ref = useRef<Refs>(null)
+                const [state, setState] = useState<Partial<P>>(props || {})
+
+                useImperativeHandle(refs, () => {
+                    return {
+                        $setProps: newProps => {
+                            setState(() => newProps)
+                        },
+                        $updateProps: newProps => {
+                            if (newProps) {
+                                setState(state => ({ ...state, ...newProps }))
+                            }
+                        },
+                        ...ref.current
+                    } as Refs & refsType<P>
+                })
+                if (Context) {
+                    return (
+                        <Context>
+                            <Component ref={ref} {...(state as any)} />
+                        </Context>
+                    )
+                }
+                return <Component ref={ref} {...(state as any)} />
+            })
+            current = instanceMap[key] = {
+                instance: void 0,
+                pending: new Promise<void>(resolve => {
+                    createRoot(div).render(
+                        <ApiComponent
+                            ref={instance => {
+                                current.instance = instanceMap[key].instance = instance!
+                                resolve()
+                            }}
+                        />
+                    )
+                })
+            }
+        }
+        await current.pending
+        props && current.instance.$setProps(props)
+        // Delay return to avoid sync issue
+        // ------------------------------------------------------------------------
+        await new Promise(resolve => setTimeout(resolve))
+        return current.instance as Refs & refsType<P>
+    }
+}

package/template/web-app/react-webpack/shared/tools/index.ts

@@ -1 +1 @@
-export * as componentInstance from './componentInstance'
+export * as componentInstance from './componentInstance'

package/template/web-app/react-webpack/shared/types/index.ts

@@ -1 +1 @@
-export * from './utils'
+export * from './utils'

package/template/web-app/react-webpack/shared/types/utils.ts

@@ -1,2 +1,2 @@
-import type { UseBoundStore, StoreApi } from 'zustand'
-export type ExtractModelType<T> = T extends UseBoundStore<StoreApi<infer S>> ? S : unknown
+import type { UseBoundStore, StoreApi } from 'zustand'
+export type ExtractModelType<T> = T extends UseBoundStore<StoreApi<infer S>> ? S : unknown

package/template/web-app/react-webpack/tsconfig.json

@@ -1,38 +1,38 @@
-{
-    "compilerOptions": {
-        "baseUrl": ".",
-        "target": "ESNext",
-        "useDefineForClassFields": true,
-        "lib": [
-            "DOM",
-            "DOM.Iterable",
-            "ESNext"
-        ],
-        "allowJs": true,
-        "strictNullChecks": true,
-        "skipLibCheck": true,
-        "esModuleInterop": false,
-        "allowSyntheticDefaultImports": true,
-        "strict": true,
-        "forceConsistentCasingInFileNames": true,
-        "strictPropertyInitialization": false,
-        "module": "ESNext",
-        "moduleResolution": "Node",
-        "resolveJsonModule": true,
-        "isolatedModules": true,
-        "noEmit": true,
-        "jsx": "react-jsx",
-        "paths": {
-            "@/*": [
-                "./*"
-            ]
-        }
-    },
-    "include": [
-        "**/*.tsx",
-        "**/*.ts"
-    ],
-    "exclude": [
-        "scripts",
-    ]
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "target": "ESNext",
+        "useDefineForClassFields": true,
+        "lib": [
+            "DOM",
+            "DOM.Iterable",
+            "ESNext"
+        ],
+        "allowJs": true,
+        "strictNullChecks": true,
+        "skipLibCheck": true,
+        "esModuleInterop": false,
+        "allowSyntheticDefaultImports": true,
+        "strict": true,
+        "forceConsistentCasingInFileNames": true,
+        "strictPropertyInitialization": false,
+        "module": "ESNext",
+        "moduleResolution": "Node",
+        "resolveJsonModule": true,
+        "isolatedModules": true,
+        "noEmit": true,
+        "jsx": "react-jsx",
+        "paths": {
+            "@/*": [
+                "./*"
+            ]
+        }
+    },
+    "include": [
+        "**/*.tsx",
+        "**/*.ts"
+    ],
+    "exclude": [
+        "scripts",
+    ]
 }

package/template/web-app/react-webpack/tsconfig.node.json

@@ -1,9 +1,9 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "allowSyntheticDefaultImports": true
-  },
-  "include": []
-}
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": []
+}

package/template/web-app/react-webpack/webpack.config.mjs

@@ -1,162 +1,162 @@
-import path from 'path'
-import webpack from 'webpack'
-import WebpackBar from 'webpackbar'
-import { EsbuildPlugin } from 'esbuild-loader'
-import HtmlWebpackPlugin from 'html-webpack-plugin'
-import MiniCssExtractPlugin from 'mini-css-extract-plugin'
-import EslintWebpackPlugin from 'eslint-webpack-plugin'
-import StylelintWebpackPlugin from 'stylelint-webpack-plugin'
-import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'
-import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
-import * as dotenv from 'dotenv'
-import { ROOT, OUTPUT, createCssLoader, createStyleLoader } from './webpack_config/index.mjs'
-
-/**
- *
- * @param {String} mode
- * @param {boolean} isProd
- * @returns {object}
- */
-function getEnvConfig(mode, isProd) {
-    const envConfig = dotenv.config({
-        path: isProd ? '.env' : `.env.${mode}`
-    }).parsed
-    Object.keys(envConfig).forEach(k => {
-        envConfig[k] = JSON.stringify(envConfig[k])
-    })
-    return envConfig
-}
-
-export default function (env) {
-    const isProd = ['prod', 'analyse'].includes(env.mode)
-    const envConfig = getEnvConfig(env.mode, isProd)
-    const publicPath = JSON.parse(envConfig.ENV_BASE_URL)
-
-    return {
-        entry: {
-            index: [path.join(ROOT, 'main.tsx')]
-        },
-        output: {
-            filename: isProd ? 'js/[name].[chunkhash].js' : 'js/[name].js',
-            chunkFilename: isProd ? 'js/[name].[chunkhash].js' : 'js/[name].js',
-            path: OUTPUT,
-            publicPath,
-            clean: true
-        },
-        mode: isProd ? 'production' : 'development',
-        stats: isProd ? 'normal' : 'errors-only',
-        performance: {
-            hints: false
-        },
-        devServer: {
-            host: '0.0.0.0',
-            hot: true,
-            open: publicPath,
-            static: {
-                publicPath
-            },
-            historyApiFallback: {
-                disableDotRule: true,
-                index: publicPath
-            },
-            devMiddleware: {
-                publicPath
-            },
-            proxy: [
-                {
-                    '/api': {
-                        target: 'http://127.0.0.1:3000',
-                        changeOrigin: true,
-                        secure: false,
-                        pathRewrite: {
-                            '^/api': ''
-                        }
-                    }
-                }
-            ]
-        },
-        module: {
-            rules: [
-                {
-                    test: /\.[jt]sx?$/,
-                    loader: 'esbuild-loader',
-                    options: {
-                        target: 'chrome82',
-                        drop: isProd ? ['console', 'debugger'] : []
-                    }
-                },
-                {
-                    test: /\.(png|jpg|jpeg|gif)$/i,
-                    type: 'asset/resource'
-                },
-                {
-                    test: /\.svg$/i,
-                    type: 'asset/resource',
-                    resourceQuery: /url/ // *.svg?url
-                },
-                {
-                    test: /\.svg$/i,
-                    issuer: /\.[jt]sx?$/,
-                    resourceQuery: { not: [/url/] }, // exclude react component if *.svg?url
-                    use: ['@svgr/webpack']
-                },
-                {
-                    test: /\.(woff|woff2|eot|ttf|otf)$/i,
-                    type: 'asset/resource'
-                },
-                {
-                    test: /\.css$/,
-                    exclude: /\.module\.css$/,
-                    use: [createStyleLoader(isProd), createCssLoader(), 'postcss-loader']
-                },
-                {
-                    test: /\.module\.css$/,
-                    use: [createStyleLoader(isProd), createCssLoader(true), 'postcss-loader']
-                }
-            ]
-        },
-        plugins: [
-            new WebpackBar(),
-            new HtmlWebpackPlugin({
-                filename: 'index.html',
-                template: path.resolve(ROOT, 'index.html')
-            }),
-            new EslintWebpackPlugin(),
-            new StylelintWebpackPlugin(),
-            new ForkTsCheckerWebpackPlugin(),
-            new webpack.DefinePlugin(envConfig),
-            new MiniCssExtractPlugin({
-                filename: isProd ? 'css/[name].[contenthash].css' : 'css/[name].css',
-                chunkFilename: isProd ? 'css/[name].[contenthash].css' : 'css/[name].css'
-            }),
-            env.mode === 'analyzer' && new BundleAnalyzerPlugin()
-        ],
-        optimization: {
-            minimizer: [new EsbuildPlugin()],
-            splitChunks: {
-                minChunks: 1,
-                cacheGroups: {
-                    default: false,
-                    react: {
-                        test: /\/(react|react-dom)\//,
-                        chunks: 'all',
-                        name: 'react'
-                    },
-                    vendor: {
-                        test: /\/node_modules\//,
-                        chunks: 'all',
-                        name: 'vendor',
-                        priority: -1
-                    }
-                }
-            }
-        },
-        resolve: {
-            extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
-            alias: {
-                '@': ROOT
-            },
-            modules: ['node_modules']
-        }
-    }
-}
+import path from 'path'
+import webpack from 'webpack'
+import WebpackBar from 'webpackbar'
+import { EsbuildPlugin } from 'esbuild-loader'
+import HtmlWebpackPlugin from 'html-webpack-plugin'
+import MiniCssExtractPlugin from 'mini-css-extract-plugin'
+import EslintWebpackPlugin from 'eslint-webpack-plugin'
+import StylelintWebpackPlugin from 'stylelint-webpack-plugin'
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'
+import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
+import * as dotenv from 'dotenv'
+import { ROOT, OUTPUT, createCssLoader, createStyleLoader } from './webpack_config/index.mjs'
+
+/**
+ *
+ * @param {String} mode
+ * @param {boolean} isProd
+ * @returns {object}
+ */
+function getEnvConfig(mode, isProd) {
+    const envConfig = dotenv.config({
+        path: isProd ? '.env' : `.env.${mode}`
+    }).parsed
+    Object.keys(envConfig).forEach(k => {
+        envConfig[k] = JSON.stringify(envConfig[k])
+    })
+    return envConfig
+}
+
+export default function (env) {
+    const isProd = ['prod', 'analyse'].includes(env.mode)
+    const envConfig = getEnvConfig(env.mode, isProd)
+    const publicPath = JSON.parse(envConfig.ENV_BASE_URL)
+
+    return {
+        entry: {
+            index: [path.join(ROOT, 'main.tsx')]
+        },
+        output: {
+            filename: isProd ? 'js/[name].[chunkhash].js' : 'js/[name].js',
+            chunkFilename: isProd ? 'js/[name].[chunkhash].js' : 'js/[name].js',
+            path: OUTPUT,
+            publicPath,
+            clean: true
+        },
+        mode: isProd ? 'production' : 'development',
+        stats: isProd ? 'normal' : 'errors-only',
+        performance: {
+            hints: false
+        },
+        devServer: {
+            host: '0.0.0.0',
+            hot: true,
+            open: publicPath,
+            static: {
+                publicPath
+            },
+            historyApiFallback: {
+                disableDotRule: true,
+                index: publicPath
+            },
+            devMiddleware: {
+                publicPath
+            },
+            proxy: [
+                {
+                    '/api': {
+                        target: 'http://127.0.0.1:3000',
+                        changeOrigin: true,
+                        secure: false,
+                        pathRewrite: {
+                            '^/api': ''
+                        }
+                    }
+                }
+            ]
+        },
+        module: {
+            rules: [
+                {
+                    test: /\.[jt]sx?$/,
+                    loader: 'esbuild-loader',
+                    options: {
+                        target: 'chrome82',
+                        drop: isProd ? ['console', 'debugger'] : []
+                    }
+                },
+                {
+                    test: /\.(png|jpg|jpeg|gif)$/i,
+                    type: 'asset/resource'
+                },
+                {
+                    test: /\.svg$/i,
+                    type: 'asset/resource',
+                    resourceQuery: /url/ // *.svg?url
+                },
+                {
+                    test: /\.svg$/i,
+                    issuer: /\.[jt]sx?$/,
+                    resourceQuery: { not: [/url/] }, // exclude react component if *.svg?url
+                    use: ['@svgr/webpack']
+                },
+                {
+                    test: /\.(woff|woff2|eot|ttf|otf)$/i,
+                    type: 'asset/resource'
+                },
+                {
+                    test: /\.css$/,
+                    exclude: /\.module\.css$/,
+                    use: [createStyleLoader(isProd), createCssLoader(), 'postcss-loader']
+                },
+                {
+                    test: /\.module\.css$/,
+                    use: [createStyleLoader(isProd), createCssLoader(true), 'postcss-loader']
+                }
+            ]
+        },
+        plugins: [
+            new WebpackBar(),
+            new HtmlWebpackPlugin({
+                filename: 'index.html',
+                template: path.resolve(ROOT, 'index.html')
+            }),
+            new EslintWebpackPlugin(),
+            new StylelintWebpackPlugin(),
+            new ForkTsCheckerWebpackPlugin(),
+            new webpack.DefinePlugin(envConfig),
+            new MiniCssExtractPlugin({
+                filename: isProd ? 'css/[name].[contenthash].css' : 'css/[name].css',
+                chunkFilename: isProd ? 'css/[name].[contenthash].css' : 'css/[name].css'
+            }),
+            env.mode === 'analyzer' && new BundleAnalyzerPlugin()
+        ],
+        optimization: {
+            minimizer: [new EsbuildPlugin()],
+            splitChunks: {
+                minChunks: 1,
+                cacheGroups: {
+                    default: false,
+                    react: {
+                        test: /\/(react|react-dom)\//,
+                        chunks: 'all',
+                        name: 'react'
+                    },
+                    vendor: {
+                        test: /\/node_modules\//,
+                        chunks: 'all',
+                        name: 'vendor',
+                        priority: -1
+                    }
+                }
+            }
+        },
+        resolve: {
+            extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
+            alias: {
+                '@': ROOT
+            },
+            modules: ['node_modules']
+        }
+    }
+}

package/template/web-app/react-webpack/webpack_config/constant.mjs

@@ -1,5 +1,5 @@
-import path from 'path'
-
-export const ROOT = process.cwd()
-export const OUTPUT = path.join(ROOT, 'dist')
-export const SCOPE_CLASS_NAME = '[name]__[local]--[hash:base64:5]'
+import path from 'path'
+
+export const ROOT = process.cwd()
+export const OUTPUT = path.join(ROOT, 'dist')
+export const SCOPE_CLASS_NAME = '[name]__[local]--[hash:base64:5]'

package/template/web-app/solid/.gitignore

@@ -1,2 +1,2 @@
-node_modules
+node_modules
 dist