@playcraft/devkit 1.0.26 → 1.0.28

package/core/webpack.common.js

@@ -1,11 +1,177 @@
-"use strict";const path=require("path");const fs=require("fs");const TsconfigPathsPlugin=require("tsconfig-paths-webpack-plugin");const{VueLoaderPlugin}=require("vue-loader");const{options}=require("./options");const tsConfigPath=path.resolve(options.tsConfig);const jsConfigPath=path.resolve(options.jsConfig);let jsTsConfigPath=null;if(fs.existsSync(tsConfigPath)){jsTsConfigPath=tsConfigPath}else if(fs.existsSync(jsConfigPath)){jsTsConfigPath=jsConfigPath}/** @type {string[]} List of file extensions that webpack will resolve */const allowedExtensions=[".vue",".ts",".tsx",".js",".json",".json5",".png",".glb",".fbx",".obj",".jpg",".webp",".mp3",".svg",".xml",".atlas",".fnt",".css",".gif",".mp4",".woff",".woff2",".ttf",".otf"];/** @type {import('webpack').Configuration} Base webpack configuration used by both development and build configs */const webpackConfig={entry:path.resolve("src/index"),resolve:{extensions:allowedExtensions,alias:{assets:path.resolve("assets"),vue:"vue/dist/vue.esm-bundler.js","@":path.resolve("src")},plugins:jsTsConfigPath?[new TsconfigPathsPlugin({configFile:jsTsConfigPath,extensions:allowedExtensions})]:[]},output:{filename:"build.js",path:path.resolve("dist")},module:{rules:[// Vue 单文件组件
-{test:/\.vue$/,loader:"vue-loader"},// {
-//   test: /\.tsx?$/,
-//   use: 'ts-loader',
-//   exclude: /node_modules/,
-// },
-{test:/\.ts?$/,exclude:/node_modules/,use:[{loader:"babel-loader",options:{// presets: ['@babel/preset-env'],
-plugins:options.compilation.allowTemplateLiterals===false?["@babel/plugin-transform-template-literals"]:[]}},{loader:"esbuild-loader",options:{loader:"ts",target:"es2015"}}]},{test:/\.css$/,use:["style-loader","css-loader"]},{test:/\.(js|mjs)$/,// exclude: /node_modules/,
-use:{loader:"babel-loader",options:{// presets: ['@babel/preset-env'],
-plugins:options.compilation.allowTemplateLiterals===false?["@babel/plugin-transform-template-literals"]:[]}}},{test:/\.(gltf)$/,loader:path.join(__dirname,"loaders/gltf-loader.js")},{test:/\.(gif|png|jpe?g|webp|mp3|mp4|m4a|ogg|wav|glb|fbx|obj)$/i,type:"asset/inline"},{test:/\.json5$/i,type:"javascript/auto",use:{loader:"json5-loader",options:{esModule:false}}},// 处理 json?url → base64
-{test:/\.json$/i,resourceQuery:/url/,type:"asset/inline",generator:{dataUrl:content=>`data:application/json;base64,${content.toString("base64")}`}},{test:/\.(svg|xml)$/i,type:"asset/source"},{test:/\.atlas$/,type:"asset/inline",generator:{dataUrl:content=>{return`data:text/atlas;base64,${content.toString("base64")}`}}},{test:/\.fnt$/i,type:"asset/inline",generator:{dataUrl:content=>{return`data:text/plain;base64,${content.toString("base64")}`}}},{test:/\.(woff|woff2|eot|ttf|otf)$/i,type:"asset/inline"}]},plugins:[new VueLoaderPlugin]};exports.allowedExtensions=allowedExtensions;exports.webpackCommonConfig=webpackConfig;
+const path = require('path');
+const fs = require('fs');
+const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+const { VueLoaderPlugin } = require('vue-loader');
+const { options } = require('./options');
+
+const tsConfigPath = path.resolve(options.tsConfig);
+const jsConfigPath = path.resolve(options.jsConfig);
+let jsTsConfigPath = null;
+if (fs.existsSync(tsConfigPath)) {
+  jsTsConfigPath = tsConfigPath;
+} else if (fs.existsSync(jsConfigPath)) {
+  jsTsConfigPath = jsConfigPath;
+}
+
+/** @type {string[]} List of file extensions that webpack will resolve */
+const allowedExtensions = [
+  '.vue',
+  '.ts',
+  '.tsx',
+  '.js',
+  '.json',
+  '.json5',
+  '.png',
+  '.glb',
+  '.fbx',
+  '.obj',
+  '.jpg',
+  '.webp',
+  '.mp3',
+  '.svg',
+  '.xml',
+  '.atlas',
+  '.fnt',
+  '.css',
+  '.gif',
+  '.mp4',
+  '.woff',
+  '.woff2',
+  '.ttf',
+  '.otf'
+];
+
+/** @type {import('webpack').Configuration} Base webpack configuration used by both development and build configs */
+const webpackConfig = {
+  entry: path.resolve('src/index'),
+  resolve: {
+    extensions: allowedExtensions,
+    alias: {
+      assets: path.resolve('assets'),
+      vue: 'vue/dist/vue.esm-bundler.js',
+      '@': path.resolve('src'),
+    },
+    plugins: jsTsConfigPath
+      ? [
+          new TsconfigPathsPlugin({
+            configFile: jsTsConfigPath,
+            extensions: allowedExtensions
+          })
+        ]
+      : []
+  },
+  output: {
+    filename: 'build.js',
+    path: path.resolve('dist')
+  },
+  module: {
+    rules: [
+      // Vue 单文件组件
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader'
+      },
+      // {
+      //   test: /\.tsx?$/,
+      //   use: 'ts-loader',
+      //   exclude: /node_modules/,
+      // },
+      {
+        test: /\.ts?$/,
+        exclude: /node_modules/,
+        use: [
+          {
+            loader: 'babel-loader',
+            options: {
+              // presets: ['@babel/preset-env'],
+              plugins:
+                options.compilation.allowTemplateLiterals === false ? ['@babel/plugin-transform-template-literals'] : []
+            }
+          },
+
+          {
+            loader: 'esbuild-loader',
+            options: {
+              loader: 'ts',
+              target: 'es2015'
+            }
+          }
+        ]
+      },
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'css-loader']
+      },
+      {
+        test: /\.(js|mjs)$/,
+        // exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            // presets: ['@babel/preset-env'],
+            plugins: options.compilation.allowTemplateLiterals === false ? ['@babel/plugin-transform-template-literals'] : []
+          }
+        }
+      },
+      {
+        test: /\.(gltf)$/,
+        loader: path.join(__dirname, 'loaders/gltf-loader.js')
+      },
+      {
+        test: /\.(gif|png|jpe?g|webp|mp3|mp4|m4a|ogg|wav|glb|fbx|obj)$/i,
+        type: 'asset/inline'
+      },
+      {
+        test: /\.json5$/i,
+        type: 'javascript/auto',
+        use: {
+          loader: 'json5-loader',
+          options: {
+            esModule: false
+          }
+        }
+      },
+      // 处理 json?url → base64
+      {
+        test: /\.json$/i,
+        resourceQuery: /url/,
+        type: 'asset/inline',
+        generator: {
+          dataUrl: (content) => `data:application/json;base64,${content.toString('base64')}`
+        }
+      },
+      {
+        test: /\.(svg|xml)$/i,
+        type: 'asset/source'
+      },
+      {
+        test: /\.atlas$/,
+        type: 'asset/inline',
+        generator: {
+          dataUrl: (content) => {
+            return `data:text/atlas;base64,${content.toString('base64')}`;
+          }
+        }
+      },
+      {
+        test: /\.fnt$/i,
+        type: 'asset/inline',
+        generator: {
+          dataUrl: (content) => {
+            return `data:text/plain;base64,${content.toString('base64')}`;
+          }
+        }
+      },
+      {
+        test: /\.(woff|woff2|eot|ttf|otf)$/i,
+        type: 'asset/inline'
+      }
+    ]
+  },
+  plugins: [
+    new VueLoaderPlugin()
+  ]
+};
+
+exports.allowedExtensions = allowedExtensions;
+exports.webpackCommonConfig = webpackConfig;

package/core/webpack.dev.js

@@ -1,15 +1,98 @@
-"use strict";const{merge}=require("webpack-merge");const webpack=require("webpack");const HtmlWebpackPlugin=require("html-webpack-plugin");const WebpackDevServer=require("webpack-dev-server");const{webpackCommonConfig}=require("./webpack.common.js");const path=require("path");const{DebuggerInjectionPlugin}=require("./plugins/DebuggerInjectionPlugin.js");const{options}=require("./options.js");const{mergeOptions}=require("./utils/mergeOptions.js");const{buildDefines}=require("./utils/buildDefines.js");const{logOptions}=require("./utils/logOptions.js");const{injectSDKPlugins}=require("./utils/injectSDKPlugins.js");/**
+const { merge } = require('webpack-merge');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const WebpackDevServer = require('webpack-dev-server');
+const { webpackCommonConfig } = require('./webpack.common.js');
+const path = require('path');
+const { DebuggerInjectionPlugin } = require('./plugins/DebuggerInjectionPlugin.js');
+const { options } = require('./options.js');
+const { mergeOptions } = require('./utils/mergeOptions.js');
+const { buildDefines } = require('./utils/buildDefines.js');
+const { logOptions } = require('./utils/logOptions.js');
+const { injectSDKPlugins } = require('./utils/injectSDKPlugins.js');
+const { PlaycraftOrientationInjectorPlugin } = require('./plugins/PlaycraftOrientationInjectorPlugin.js');
+
+/**
  * Creates webpack configuration for development
  * @param {Partial<import('./index').CLIOptions>} [customOptions] - Custom options to merge with default options
  * @param {Record<string, any>} [customDefines] - Additional defines for webpack.DefinePlugin
  * @param {import('webpack').Configuration} [webpackCustomConfig] - Custom webpack config to merge
  * @returns {import('webpack').Configuration} Final webpack development configuration
- */function makeWebpackDevConfig(customOptions,customDefines,webpackCustomConfig){const devOptions=mergeOptions(options,customOptions);logOptions(devOptions);customDefines=customDefines||{};webpackCustomConfig=webpackCustomConfig||{};const webpackConfig=merge(webpackCommonConfig,{mode:"development",devtool:"inline-source-map",devServer:{static:{directory:path.resolve("dist")},hot:true,// compress: true,
-port:devOptions["port"],allowedHosts:"all",open:devOptions["open"]},plugins:[new HtmlWebpackPlugin({template:path.resolve("src/index.html"),inlineSource:".(js|css|png|jpg|webp|svg|xml|atlas|mp3|gif|glb|fbx|obj)$",meta:{viewport:"width=device-width,initial-scale=1.0,viewport-fit=cover,maximum-scale=1.0,user-scalable=no"}}),new webpack.DefinePlugin({...buildDefines(),...devOptions.defines,__DEV__:JSON.stringify(devOptions["dev"]===undefined?true:devOptions["dev"]),...customDefines})]},webpackCustomConfig);if(devOptions["debugger"]){webpackConfig.plugins.push(new DebuggerInjectionPlugin(devOptions["debugger"]))}// 注入渠道 SDK 插件（与 build 保持一致）
-injectSDKPlugins(webpackConfig,{network:devOptions["network"],protocol:devOptions["protocol"],orientation:devOptions["orientation"]});return webpackConfig}/**
+ */
+function makeWebpackDevConfig(customOptions, customDefines, webpackCustomConfig) {
+  const devOptions = mergeOptions(options, customOptions);
+  logOptions(devOptions)
+  customDefines = customDefines || {};
+  webpackCustomConfig = webpackCustomConfig || {};
+
+  /** @type {'both'|'landscape'|'portrait'} */
+  const playcraftOrientationValue = devOptions.playcraftOrientationValue || 'both';
+
+  const webpackConfig = merge(
+    webpackCommonConfig,
+    {
+      mode: 'development',
+      devtool: 'inline-source-map',
+      devServer: {
+        static: {
+          directory: path.resolve('dist')
+        },
+        hot: true,
+        // compress: true,
+        port: devOptions['port'],
+        allowedHosts: 'all',
+        open: devOptions['open']
+      },
+      plugins: [
+        new HtmlWebpackPlugin({
+          template: path.resolve('src/index.html'),
+          inlineSource: '.(js|css|png|jpg|webp|svg|xml|atlas|mp3|gif|glb|fbx|obj)$',
+          meta: {
+            viewport: 'width=device-width,initial-scale=1.0,viewport-fit=cover,maximum-scale=1.0,user-scalable=no'
+          }
+        }),
+        // 注入 window.playcraftOrientation 全局变量，标识当前构建产物对应的横竖屏方向版本
+        new PlaycraftOrientationInjectorPlugin(playcraftOrientationValue),
+
+        new webpack.DefinePlugin({
+          ...buildDefines(devOptions),
+          ...devOptions.defines,
+          __DEV__: JSON.stringify(devOptions['dev'] === undefined ? true : devOptions['dev']),
+          ...customDefines
+        })
+      ]
+    },
+    webpackCustomConfig
+  );
+
+  if (devOptions['debugger']) {
+    webpackConfig.plugins.push(new DebuggerInjectionPlugin(devOptions['debugger']));
+  }
+
+  // 注入渠道 SDK 插件（与 build 保持一致）
+  injectSDKPlugins(webpackConfig, {
+    network: devOptions['network'],
+    protocol: devOptions['protocol'],
+    playcraftOrientationValue
+  });
+
+  return webpackConfig;
+}
+
+/**
  * Starts webpack development server
  * @param {import('webpack').Configuration} [webpackConfig] - Webpack configuration to use, creates default if not provided
  * @param {Partial<import('./index').CLIOptions>} [customOptions] - Custom options to merge with default options
  * @param {Record<string, any>} [customDefines] - Additional defines for webpack.DefinePlugin
  * @param {import('webpack').Configuration} [webpackCustomConfig] - Custom webpack config to merge
- */function runDev(webpackConfig,customOptions,customDefines,webpackCustomConfig){if(!webpackConfig)webpackConfig=makeWebpackDevConfig(customOptions,customDefines,webpackCustomConfig);const compiler=webpack(webpackConfig);const server=new WebpackDevServer(webpackConfig.devServer,compiler);server.start()}exports.makeWebpackDevConfig=makeWebpackDevConfig;exports.runDev=runDev;
+ */
+function runDev(webpackConfig, customOptions, customDefines, webpackCustomConfig) {
+  if (!webpackConfig) webpackConfig = makeWebpackDevConfig(customOptions, customDefines, webpackCustomConfig);
+
+  const compiler = webpack(webpackConfig);
+  const server = new WebpackDevServer(webpackConfig.devServer, compiler);
+  server.start();
+}
+
+exports.makeWebpackDevConfig = makeWebpackDevConfig;
+exports.runDev = runDev;

package/defines.d.ts

@@ -49,7 +49,7 @@ declare const APP: string;
 declare const NAME: string;
 declare const VERSION: string;
 declare const LANGUAGE: 'auto' | 'en' | 'es' | 'zh' | 'hi' | 'ar' | 'fr' | 'de' | 'ja' | 'pt';
-declare const ORIENTATION: 'both' | 'portrait' | 'landscape' | 'square';
+declare const PLAYCRAFT_ORIENTATION: 'both' | 'landscape' | 'portrait';
 declare const BUILD_HASH: string;
 
 declare const __DEV__: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playcraft/devkit",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "description": "HTML5 Playable Ads 构建工具，支持多广告渠道打包",
   "main": "core/index.js",
   "module": "core/index.js",
@@ -15,6 +15,7 @@
     "defines.d.ts"
   ],
   "scripts": {
+    "build": "node scripts/build.js",
     "deploy": "npm run build && cd dist && npm publish --registry https://registry.npmjs.org/ --access public",
     "deploy:beta": "npm run build && cd dist && npm publish --registry https://registry.npmjs.org/ --access public --tag beta"
   },
@@ -82,4 +83,4 @@
   "publishConfig": {
     "registry": "https://www.npmjs.com/registry"
   }
-}
+}