修复资源加载双斜杠问题

This commit is contained in:
chendishen 2020-10-30 09:59:12 +08:00
parent 2d8e100275
commit 07c0c119ec
20 changed files with 54596 additions and 47 deletions

View File

@ -172,7 +172,7 @@ api 文档 (待完善,如有需要功能欢迎提[issue](https://github.com/
| TouchHead | 点击头部时聊天框随机出现数组的值,该值当模型未存入头部触摸事件时无效 | Array<String> | ['讨厌,不要掐人家的脸嘛~','希望明天也能感受到你的触摸呢'] |
| TouchDefault | 点击盒子任意位置时聊天框随机出现数组的值,该值所有模型均有效且优先级最低 | Array<String> | ['今天又是开心的一天呢~','真是元气满满呀'] |
| color | 聊天框背景颜色 | String | '#C8E6FE' |
| PathFull | 当SSR框架时必须传入此参数用以额外指定绝对路径资源域名地址 | String | '' |
| PathFull | 当SSR框架时必须传入此参数用以额外指定绝对路径资源域名地址当SPA框架时目录较深的页面也可以根据自己需要设置该参数指向正确的路径如'../Resources/' | String | '' |
| MobileShow | 是否在移动设备展示看板娘 | Boolean | false |
| menuList | 启用的功能菜单列表该值传空数组时不启用菜单可用参数为Mtab | Array<String> | ['Mtab'] |

View File

@ -133,8 +133,8 @@ export namespace Live2DCubismFramework {
}
/**
* Cubism Framework内のリソースを初期化してモデルを表示可能な状態にします<br>
* Initialize()Dispose()
* Cubism Framework内的资源初始化使
* InitializeDispose
*/
public static initialize(): void {
CSM_ASSERT(s_isStarted);

View File

@ -92,7 +92,7 @@ export namespace Live2DCubismFramework {
motionQueueEntry._motion = motion;
// console.log('eventCount',motion['_motionData'])
// 添加超频动作拦截器据测试curveCount超过100的模型会导致动作异常,待修复 2020.9.11
if(motion['_motionData']['curveCount']<100){
if(motion?.['_motionData']?.['curveCount']<100){
this._motions.pushBack(motionQueueEntry);
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
{"h":"f7b9d5e2581cdd0feba1","c":{"main":true}}
{"h":"3ed51b02b5f80f9ff845","c":{"main":true}}

View File

@ -151,13 +151,15 @@ function ReactLive2d(props) {
return;
}
_lappdelegate.LAppDelegate.getInstance().run();
_lappdelegate.LAppDelegate.getInstance().run(); // window.onbeforeunload = () => LAppDelegate.releaseInstance();
window.onbeforeunload = function () {
return _lappdelegate.LAppDelegate.releaseInstance();
};
}
}, []);
(0, _react.useEffect)(function () {
if (props.release == true) {
_lappdelegate.LAppDelegate.releaseInstance();
}
}, [props.release]);
return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
style: containerStyle,
width: props.width ? props.width : '300',

View File

@ -44,7 +44,7 @@ export class LAppDelegate {
*
*/
public static releaseInstance(): void {
console.log("releaseInstance")
console.log("释放实例")
if (s_instance != null) {
s_instance.release();
}
@ -75,12 +75,15 @@ export class LAppDelegate {
}
//这里id的值与上方的 cavans 变量保持一致
let rect = document.getElementById("live2d").getBoundingClientRect();
let posX: number = e.clientX - rect.left;
let posY: number = e.clientY - rect.top;
// console.log("onMouseMoved: gate文件中posY值为 【"+posY+"】 canvas的top距离为"+rect.top);
LAppDelegate.getInstance()._view.onTouchesMoved(posX, posY);
// 如果不存在live2d,不进行操作
if(document.getElementById("live2d")){
//这里id的值与上方的 cavans 变量保持一致
let rect = document.getElementById("live2d").getBoundingClientRect();
let posX: number = e.clientX - rect.left;
let posY: number = e.clientY - rect.top;
// console.log("onMouseMoved: gate文件中posY值为 【"+posY+"】 canvas的top距离为"+rect.top);
LAppDelegate.getInstance()._view.onTouchesMoved(posX, posY);
}
}, false);

View File

@ -78,10 +78,14 @@ export class LAppView {
this._touchManager = null;
this._deviceToScreen = null;
this._gear.release();
if(this._gear){
this._gear.release();
}
this._gear = null;
this._back.release();
if(this._back){
this._back.release();
}
this._back = null;
gl.deleteProgram(this._programId);

View File

@ -1,11 +1,23 @@
import React from 'react';
import ReactDOM from 'react-dom';
import React,{ useState,useEffect} from 'react';
import ReactLive2d from '../../src/index.js';
function App(prop){
function App(props){
const [release,setRelease] = useState(false)
function handleClick() {
setRelease(true)
props.history.push({ pathname: "/Other" });
}
useEffect(() => {
}, []);
return(
<div>
<div>liv2d</div>
<button type="button" onClick={handleClick}>
Go normal page test
</button>
<ReactLive2d
width={300}
height={500}
@ -13,8 +25,9 @@ import ReactLive2d from '../../src/index.js';
right={'10px'}
ModelList={['Haru','Hiyori']}
TouchBody={['啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊你要干嘛','哼','坏人']}
release={release}
/>
</div>
)
};
ReactDOM.render(<App />, document.getElementById('root'))
export default App

View File

@ -0,0 +1,20 @@
import React, { useEffect } from 'react';
function Other(props) {
function handleClick() {
props.history.push({ pathname: "/" });
}
return (
<div className="App">
<div>其他普通页面</div>
<button type="button" onClick={handleClick}>
Go to the Live2d components page
</button>
</div>
);
}
export default Other;

View File

@ -0,0 +1,20 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route} from "react-router-dom";
import App from './App';
import Other from './Other';
function Main(){
return (
<Router>
<Route path="/" exact component={App} />
<Route path="/Other" exact component={Other} />
</Router>
)
}
export default Main
ReactDOM.render(
<Main />,
document.getElementById('root')
);

View File

@ -1,6 +1,6 @@
{
"name": "react-live2d",
"version": "1.0.18",
"version": "1.0.30",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@ -1351,6 +1351,12 @@
"@types/node": "*"
}
},
"@types/history": {
"version": "4.7.8",
"resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.8.tgz",
"integrity": "sha512-S78QIYirQcUoo6UJZx9CSP0O2ix9IaeAXwQi26Rhr/+mg7qqPy8TzaxHSUut7eGjL8WmLccT7/MXf304WjqHcA==",
"dev": true
},
"@types/html-minifier-terser": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.0.tgz",
@ -1400,6 +1406,27 @@
"@types/react": "*"
}
},
"@types/react-router": {
"version": "5.1.8",
"resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.8.tgz",
"integrity": "sha512-HzOyJb+wFmyEhyfp4D4NYrumi+LQgQL/68HvJO+q6XtuHSDvw6Aqov7sCAhjbNq3bUPgPqbdvjXC5HeB2oEAPg==",
"dev": true,
"requires": {
"@types/history": "*",
"@types/react": "*"
}
},
"@types/react-router-dom": {
"version": "5.1.5",
"resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.1.5.tgz",
"integrity": "sha512-ArBM4B1g3BWLGbaGvwBGO75GNFbLDUthrDojV2vHLih/Tq8M+tgvY1DSwkuNrPSwdp/GUL93WSEpTZs8nVyJLw==",
"dev": true,
"requires": {
"@types/history": "*",
"@types/react": "*",
"@types/react-router": "*"
}
},
"@types/source-list-map": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
@ -5395,6 +5422,20 @@
"integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
"dev": true
},
"history": {
"version": "4.10.1",
"resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz",
"integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==",
"dev": true,
"requires": {
"@babel/runtime": "^7.1.2",
"loose-envify": "^1.2.0",
"resolve-pathname": "^3.0.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0",
"value-equal": "^1.0.1"
}
},
"hmac-drbg": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
@ -5406,6 +5447,15 @@
"minimalistic-crypto-utils": "^1.0.1"
}
},
"hoist-non-react-statics": {
"version": "3.3.2",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
"dev": true,
"requires": {
"react-is": "^16.7.0"
}
},
"homedir-polyfill": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.3.tgz",
@ -6460,6 +6510,16 @@
"integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
"dev": true
},
"mini-create-react-context": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.0.tgz",
"integrity": "sha512-b0TytUgFSbgFJGzJqXPKCFCBWigAjpjo+Fl7Vf7ZbKRDptszpppKxXH6DRXEABZ/gcEQczeb0iZ7JvL8e8jjCA==",
"dev": true,
"requires": {
"@babel/runtime": "^7.5.5",
"tiny-warning": "^1.0.3"
}
},
"minimalistic-assert": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
@ -7555,6 +7615,56 @@
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
"dev": true
},
"react-router": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
"integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==",
"dev": true,
"requires": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"hoist-non-react-statics": "^3.1.0",
"loose-envify": "^1.3.1",
"mini-create-react-context": "^0.4.0",
"path-to-regexp": "^1.7.0",
"prop-types": "^15.6.2",
"react-is": "^16.6.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
"dev": true
},
"path-to-regexp": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
"integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
"dev": true,
"requires": {
"isarray": "0.0.1"
}
}
}
},
"react-router-dom": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz",
"integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==",
"dev": true,
"requires": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"loose-envify": "^1.3.1",
"prop-types": "^15.6.2",
"react-router": "5.2.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
}
},
"readable-stream": {
"version": "2.3.6",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
@ -7917,6 +8027,12 @@
"integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=",
"dev": true
},
"resolve-pathname": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz",
"integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng==",
"dev": true
},
"resolve-url": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
@ -8979,6 +9095,18 @@
"setimmediate": "^1.0.4"
}
},
"tiny-invariant": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz",
"integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw==",
"dev": true
},
"tiny-warning": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
"integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==",
"dev": true
},
"tmp": {
"version": "0.0.33",
"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
@ -9447,6 +9575,12 @@
"integrity": "sha512-CNmdbwQMBjwr9Gsmohvm0pbL954tJrNzf6gWL3K+QMQf00PF7ERGrEiLgjuU3mKreLC2MeGhUsNV9ybTbLgd3w==",
"dev": true
},
"value-equal": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz",
"integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==",
"dev": true
},
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",

View File

@ -13,7 +13,7 @@
},
"main": "dist/bundle.js",
"name": "react-live2d",
"version": "1.0.24",
"version": "1.0.30",
"description": "live2D 看板娘",
"author": {
"name": "DS",
@ -36,6 +36,7 @@
"@types/node": "^14.6.0",
"@types/react": "^16.9.46",
"@types/react-dom": "^16.9.8",
"@types/react-router-dom": "^5.1.5",
"@typescript-eslint/eslint-plugin": "^2.18.0",
"@typescript-eslint/parser": "^2.18.0",
"babel-loader": "^8.1.0",
@ -47,6 +48,7 @@
"prettier": "^1.19.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-router-dom": "^5.2.0",
"rimraf": "^3.0.1",
"serve": "^11.3.0",
"style-loader": "^1.2.1",

View File

@ -120,11 +120,17 @@ function ReactLive2d(props) {
LAppDelegate.getInstance().run();
window.onbeforeunload = () => LAppDelegate.releaseInstance();
// window.onbeforeunload = () => LAppDelegate.releaseInstance();
}
}, []);
useEffect(() =>{
if(props.release==true){
LAppDelegate.releaseInstance();
}
}, [props.release])
return (
<div>
<div

View File

@ -39,7 +39,6 @@ export const PowerImageName = 'CloseNormal.png';
// モデル定義---------------------------------------------
// モデルを配置したディレクトリ名の配列
// ディレクトリ名とmodel3.jsonの名前を一致させておくこと
// export const ModelDir: string[] = ['Haru', 'Hiyori', 'Mark', 'Natori', 'Rice'];
export let ModelDir: string[] = ['Hiyori', 'Haru', 'Rice'];
// 外部定義ファイルjsonと合わせる

View File

@ -44,7 +44,7 @@ export class LAppDelegate {
*
*/
public static releaseInstance(): void {
console.log("releaseInstance")
console.log("释放实例")
if (s_instance != null) {
s_instance.release();
}
@ -75,12 +75,15 @@ export class LAppDelegate {
}
//这里id的值与上方的 cavans 变量保持一致
let rect = document.getElementById("live2d").getBoundingClientRect();
let posX: number = e.clientX - rect.left;
let posY: number = e.clientY - rect.top;
// console.log("onMouseMoved: gate文件中posY值为 【"+posY+"】 canvas的top距离为"+rect.top);
LAppDelegate.getInstance()._view.onTouchesMoved(posX, posY);
// 如果不存在live2d,不进行操作
if(document.getElementById("live2d")){
//这里id的值与上方的 cavans 变量保持一致
let rect = document.getElementById("live2d").getBoundingClientRect();
let posX: number = e.clientX - rect.left;
let posY: number = e.clientY - rect.top;
// console.log("onMouseMoved: gate文件中posY值为 【"+posY+"】 canvas的top距离为"+rect.top);
LAppDelegate.getInstance()._view.onTouchesMoved(posX, posY);
}
}, false);

View File

@ -87,7 +87,7 @@ export class LAppModel extends CubismUserModel {
public loadAssets(dir: string, fileName: string): void {
console.log('资源路径',dir)
this._modelHomeDir = dir;
fetch(`${this._modelHomeDir}/${fileName}`)
fetch(`${this._modelHomeDir}${fileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
const setting: ICubismModelSetting = new CubismModelSettingJson(
@ -119,7 +119,7 @@ export class LAppModel extends CubismUserModel {
if (this._modelSetting.getModelFileName() != '') {
const modelFileName = this._modelSetting.getModelFileName();
fetch(`${this._modelHomeDir}/${modelFileName}`)
fetch(`${this._modelHomeDir}${modelFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
this.loadModel(arrayBuffer);
@ -145,7 +145,7 @@ export class LAppModel extends CubismUserModel {
i
);
fetch(`${this._modelHomeDir}/${expressionFileName}`)
fetch(`${this._modelHomeDir}${expressionFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
const motion: ACubismMotion = this.loadExpression(
@ -187,7 +187,7 @@ export class LAppModel extends CubismUserModel {
if (this._modelSetting.getPhysicsFileName() != '') {
const physicsFileName = this._modelSetting.getPhysicsFileName();
fetch(`${this._modelHomeDir}/${physicsFileName}`)
fetch(`${this._modelHomeDir}${physicsFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
this.loadPhysics(arrayBuffer, arrayBuffer.byteLength);
@ -211,7 +211,7 @@ export class LAppModel extends CubismUserModel {
if (this._modelSetting.getPoseFileName() != '') {
const poseFileName = this._modelSetting.getPoseFileName();
fetch(`${this._modelHomeDir}/${poseFileName}`)
fetch(`${this._modelHomeDir}${poseFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
this.loadPose(arrayBuffer, arrayBuffer.byteLength);
@ -282,7 +282,7 @@ export class LAppModel extends CubismUserModel {
if (this._modelSetting.getUserDataFile() != '') {
const userDataFile = this._modelSetting.getUserDataFile();
fetch(`${this._modelHomeDir}/${userDataFile}`)
fetch(`${this._modelHomeDir}${userDataFile}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
this.loadUserData(arrayBuffer, arrayBuffer.byteLength);
@ -577,7 +577,7 @@ export class LAppModel extends CubismUserModel {
let autoDelete = false;
if (motion == null) {
fetch(`${this._modelHomeDir}/${motionFileName}`)
fetch(`${this._modelHomeDir}${motionFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
motion = this.loadMotion(
@ -739,7 +739,7 @@ export class LAppModel extends CubismUserModel {
);
}
fetch(`${this._modelHomeDir}/${motionFileName}`)
fetch(`${this._modelHomeDir}${motionFileName}`)
.then(response => response.arrayBuffer())
.then(arrayBuffer => {
const tmpMotion: CubismMotion = this.loadMotion(

View File

@ -78,10 +78,14 @@ export class LAppView {
this._touchManager = null;
this._deviceToScreen = null;
this._gear.release();
if(this._gear){
this._gear.release();
}
this._gear = null;
this._back.release();
if(this._back){
this._back.release();
}
this._back = null;
gl.deleteProgram(this._programId);

View File

@ -12,7 +12,7 @@ module.exports = {
// 生产
entry: './src/index.js',
// 测试
// entry: './example/src/App.js',
// entry: './example/src/index.js',
node: {
fs: 'empty'
},