LayaBox疑难杂症


请尊重原作者的工作,转载时请务必注明转载自:www.xionggf.com

Ask:启用LayaAir IDE后,在我的电脑上编译失败并出现以下错误

error TS5007: Cannot resolve referenced file: '.'.  
error TS5023: Unknown option 'p'  
Use the '--help' flag to see options.

Answer: 错误的原因是typescript版本的问题。通常是由于安装了VS2015等开发工具后把TypeScript的系统路径预先设置一次了,
这时候 就算安装好Node.js并用npm配置了typescript compiler的版本都会出这个问题。解决方法是打开环境变量配
置观察界面。找到Path里面的typscript环境配置项。本人电脑下的目录是:

C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.0\。

但是实际上已使用了npm全局安装最新版本的Typescript,所以将这个配置删除。即可


Ask: LayaAir IDE 1.7.18,用typescript作为开发语言,断点没效果

Answer: 用chrome浏览器,不能用layaair窗口进行调试;用chrome浏览器时,加断点调试要重新刷新一下页面才有效果,html页面加载的时候执行代码断点可能不生效,官网有详细解释。layabox官网关于解答此问题的页面地址在这里


Ask: 有一个类A,有一个类B,且类B继承自类A,当编译运行时,会出现“B is not a constructor”的情况。

Answer:在stackoverflow网站中有人就这个问题做出了解答。参考页面是这个。主要是因为把ts语言编译成js的话,如果不把具有同一个命名空间的不同文件,编译一个js文件的话,那么就要按照相互引用关系,把基类文件放在前面,引用基类的文件放在后面,例如在这个页面举的例子中:在运行js的html页面中,引用关系先后依次加入到标签中:

<script src="Validation.js" type="text/javascript" />
<script src="LettersOnlyValidator.js" type="text/javascript" />
<script src="ZipCodeValidator.js" type="text/javascript" />
<script src="Test.js" type="text/javascript" />

回到layabox环境,如果用chrome浏览器作为调试器的话,运行游戏js的页面在工程目录bin下的index.html文件中,打开此文件,找到标签:

<!--用户自定义顺序文件添加到这里-->
<!--jsfile--Custom-->

<!--jsfile--Custom-->

在中间按引用顺序先后添加上< script >标签就好。


Ask: 把Laya工程导出成一个web应用之后,用chrome浏览器单单击打开index.html文件,发现用到的资源图片等文件无法加载,报“access to image from origin null has been blocked by CORS policy”这样子的错。用LayaAir IDE是正常的。

Answer:这是一个跨域的问题,关于跨域的问题参考网页在这里:
https://stackoverflow.com/questions/41965066/access-to-image-from-origin-null-has-been-blocked-by-cors-policy
https://harttle.land/2016/12/30/cors-redirect.html
http://www.it1352.com/554991.html
https://blog.csdn.net/less_cold/article/details/53390313

对于这个问题,可以简单地理解为js代码装载图片文件时,是要在一个web server中执行,如果不对浏览器做任何的配置的话而直接打开发布后index.html文件的话,相当于没在一个web server而是在本地文件系统中查找,故而会发生类似的问题。至于为什么用LayaAir IDE能够正常地打开,原因在于Laya工程中的.laya目录下有一个launch.json文件,这个文件是IDE自动给每一个工程生成的,IDE在启用chrome浏览器时会读取它作为启动参数配置,如下代码所示:

{
    "version": "0.2.0",
    "configurations": [ 
        {
            "name": "layaAir",
            "type": "chrome",
            "request": "launch",
            "file": "${workspaceRoot}/bin/index.html",
            "runtimeExecutable": "${execPath}",
            "useBuildInServer": true,
            "sourceMaps": true,
            "webRoot": "${workspaceRoot}",
            "port": 9222,
            "fixedPort":false
        },
        {
            "name": "chrome调试",
            "type": "chrome",
            "request": "launch",
            "file": "${workspaceRoot}/bin/index.html",
            // "换成自己的谷歌安装路径,": 比如
            //window 默认安装路径为: "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe"
            //mac 系统上的默认安装路径为 "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome";
            // "runtimeExecutable": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe",
            "runtimeArgs": [
                "--allow-file-access-from-files",
                " --disable-web-security"
            ],
            "sourceMaps": true,
            "webRoot": "${workspaceRoot}",
            //假如谷歌调试报userDataDir不可用,请把谷歌安装路径取得管理员权限,或者更换${tmpdir}为其他可以读写的文件夹,也可以删除。
            "userDataDir": "${workspaceRoot}/.laya/chrome",
            "fixedPort":false
        }
    ]
}

上面的runtimeArgs就是决定了chrome启用策略。因此如果想对发布后的index.html直接打开运行,而不用扔到web上的话,只需要在Chrome的快捷方式下,编辑命令行语句C:\Users\Administrator\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files --disable-web-security就可以正常打开并加载图片资源了。注意当加入这些命令行参数后,启动chrome,再拖入index.html文件。而不能直接右键点击html文件选择chrome打开,因为这样子的执行方式是没有加上需要的命令行参数的。