跳到主要内容

Legacy 模式

现有项目升级至 Legacy 模式​

步骤一：替换现有的编译命令​

  1. 使用白鹭引擎 5.4 以上版本创建一个新项目，然后将scripts/plugins文件夹拷贝至现有项目同级目录下。
  2. 在 scripts/config.ts 最上面添加如下代码
import  {  WebpackBundlePlugin,  WebpackDevServerPlugin  }  from  "./plugins/webpack-plugin";


  1. 将 scripts/config.ts 中的 IncrementCompilePlugin 和 CompilePlugin 替换为 WebpackDevServerPlugin 和 WebpackBundlePlugin 。以 WebpackDevServerPlugin 为例：
const outputDir =  ".";

return  {

 outputDir,

 commands:  [

  // new IncrementCompilePlugin(), 去掉此插件

  new  WebpackDevServerPlugin(

  // 设置编译参数

  )

  ]

};


步骤二：设置编译参数​

WebpackDevServerPlugin 和 WebpackBundlePlugin 内部实现均是调用了 @egret/egret-webpack-bunlder 中的相关方法，调用这些方法需要传递参数，通常按照默认值设置即可，主要需要注意的参数是 typescript.mode，如果是现有项目请确认设置为 legacy。如下所示：

new  WebpackDevServerPlugin({

 libraryType:  "debug",

 defines:  {  DEBUG:  true,  RELEASE:  false  },

 typescript:  { mode:  "legacy"  }

});


各个参数的具体功能您可以在 VSCode 中按住 Ctrl 键点击相关代码查看。

步骤三：执行构建​

修改完上述代码后，执行 egret build 即可。首次执行该命令时会进行自动安装，具体请参见安装与更新这篇文档。

egret build 执行后可能会抛出编译错误，这是因为白鹭引擎之前的TypeScript编译器是2.4版本，而最新则采用3.9版本，新版本编译器会进行更严格的类型检查。修复这些错误后即可顺利运行您的项目。

WebpackDevServerPlugin 执行后会自动启动一个 HTTP 服务器，类似 egret run 功能，这是一个阻塞式插件，该插件后续其他插件不会执行，请确保该插件是您的构建管线的最后一步。