php - laravel 모듈화 및 webpack+vue.js 솔루션을 해결하는 방법은 무엇입니까?

Question

최근 회사 프로젝트에서는 백엔드 개발을 위해 vue family bucket + element-ui를 사용해야 하는데 원래 프로젝트는 requirejs로 작성했기 때문에 모든 laravel 모듈은 독립적으로 설치 및 제거가 가능합니다. 즉, 해당 js와 CSS는 모두 독립적이며 공개 항목은 테마 디렉토리에 직접 배치됩니다. 그러면 단일 페이지 프로그램이 이 솔루션을 어떻게 구현합니까? 요구 사항은 다음과 같습니다. themes/backend
(참고: 여기 모듈은 laravel의 모듈입니다. , js 및 npm 모듈이 아님 )

1. 각 모듈은 독립적으로 설치되며, 자동 게시 모듈의

   가 자동으로 로드될 수 있습니다(Resources/Bakcend/assets目录到public/backend/modules/模块名下面,并且在themes/bakcend/index.blade.phpsolved)

2. 한 페이지의 백엔드는 webpack을 사용하여 패키징되었으며, 패키징 디렉터리

   s는 아래와 같습니다(public/backend/modules/模块名下面,并在打包后自动复制一份到modules/模块名/Resources/Bakcend/assetsolved)

3. 각 모듈은 자체 백엔드 메뉴, 관리 인터페이스 등을 가질 수 있으며 이는 모두 vue, vue-router, element-ui로 구현됩니다. 모든 모듈의 시작 페이지는

   , (themes/backend_default/index.blade.phpsolved)에 있습니다. 4. 각 모듈은 다양한 제3자에 의해 개발될 수 있으며 일반 모듈 센터에 게시될 수 있습니다. 사용자는 필요한 모듈을 직접 다운로드할 수 있습니다. (
   PHP 백엔드는 해결되었지만 프런트엔드 JS에는 문제가 있습니다)

위 네 번째 요구사항의 프론트엔드 측면에서 문제가 발생합니다. 개인 또는 내부 팀이 모든 모듈을 개발하는 경우에는 이러한 문제가 발생하지 않습니다. 그러나 다른 타사 개발로 인해 웹팩 패키징 문제가 발생할 수 있습니다.

현재 두 가지 해결 방법이 있지만 둘 다 문제를 근본적으로 해결할 수는 없습니다

첫 번째는

각 laravel-module이 별도로 패키지되어 있습니다

. 하지만 단일 페이지 백엔드에서는 각 모듈에 대해 Vendor.js를 생성하여 공개하거나 공용 클래스 라이브러리를 app.js에 추가하면 전체 에 로드된 각 모듈(블로그 모듈, 코어 모듈, 대시보드 모듈 등)의 Vendor.js 및 app.js가 이러한 공용 클래스 라이브러리 를 반복적으로 로드합니다.

두 번째는 테마/백엔드 테마 아래 통합 패키징입니다.
각 모듈의 리소스는 themes/backend/modules/{module-name}里面，打包后自动抽取到各自的module/Resources/Backend/assets中，然后别人安装module的时候自动publish这个module里面的assets到public/backend/modules/{module-name}目录里，但是这样也不行，因为如果每个开发者负责的module不同，所以在webpack.config.js or webpack.mix.js里打包的东西也是不同的，比如我写blog module的app.js,你写 dashboard module的app.js，那么各自打包后的assets生成的vendor.js(공개 클래스 라이브러리에 저장된 파일) 서로 다른 webpack 모듈 ID로 배치됩니다(모든 모듈의 app.js 공개 클래스가 있더라도). 라이브러리는 동일합니다), 게시 후 다른 모듈의 app.js를 로드하면 오류가 발생합니다. 각 모듈의 Vendor.js가 다르고 로드할 항목을 선택할 수 없기 때문입니다

이 문제를 구체적으로 해결하는 방법은 무엇입니까?

Answer 1

참조: /a/11...
웹팩 기반 SPA 단일 페이지 웹 애플리케이션 플러그인을 동적으로 로드하는 메커니즘