2017-11-15 16 views
0

저는 많은 파일을 통해 많은 의존성이 확산되어있는 상당히 큰 프로젝트를 진행하고 있습니다. 우선, 이러한 종속성 대부분을 관리하기 위해 NPM 및 webpack을 실행하고 있습니다. workbox 문서에는 webpack (말 그대로 예제 일뿐)이나 NPM을 통해이 두 가지를 통합하는 두 가지 방법이 있습니다. NPM 사용을 결정했습니다. workpack을 webpack/NPM에 올바르게 통합하는 방법은 무엇입니까?

npm install --save-dev workbox-sw 

package.json 종속 섹션에 연장 상자-SW를 추가 : 나는 다음과 같은 명령을 실행. 그러나 때마다 내가 사용 가져 오려고 :

import Workbox-SW from 'workbox-sw' 

이 나에게 다음과 같은 오류를 제공합니다 :

Uncaught WorkboxError: An error was thrown by workbox with error code: ;'not-in-sw'

나는하지만 순진, 몇 가지 다른 방법을 시도했습니다. webpack 문서는 확실히 부족한데, 올바르게 실행하려면 다른 종속성을 설치하지 않는 것이 좋습니다. 몇 가지 다른 중요한 참고 : 나는

  • Vue.js
  • 을 사용하고

    1. 라우팅을 통해 상호 작용 내가 만든 몇 가지 다른 구성 요소가 있습니다. 특정 구성 요소로 가져 오려고합니다.

    여기에 전체 오류 메시지입니다 :

    Uncaught WorkboxError: An error was thrown by workbox with error code: ;'not-in-sw' 
        at eval (webpack-internal:///259:175:40) 
        at Object.<anonymous> (http://localhost:8080/app.js:2361:1) 
        at __webpack_require__ (http://localhost:8080/app.js:660:30) 
        at fn (http://localhost:8080/app.js:86:20) 
        at eval (webpack-internal:///173:3:69) 
        at Object.<anonymous> (http://localhost:8080/app.js:1795:1) 
        at __webpack_require__ (http://localhost:8080/app.js:660:30) 
        at fn (http://localhost:8080/app.js:86:20) 
        at eval (webpack-internal:///239:8:3) 
        at Object.<anonymous> (http://localhost:8080/app.js:2239:1) 
    WorkboxError @ workbox-sw.prod.v2.1.1.mjs?efda:155 
    (anonymous) @ workbox-sw.prod.v2.1.1.mjs?efda:175 
    (anonymous) @ app.js:2361 
    __webpack_require__ @ app.js:660 
    fn @ app.js:86 
    (anonymous) @ 173:3 
    (anonymous) @ app.js:1795 
    __webpack_require__ @ app.js:660 
    fn @ app.js:86 
    (anonymous) @ HomeView.vue?afbe:8 
    (anonymous) @ app.js:2239 
    __webpack_require__ @ app.js:660 
    fn @ app.js:86 
    (anonymous) @ index.js?3672:1 
    (anonymous) @ app.js:1809 
    __webpack_require__ @ app.js:660 
    fn @ app.js:86 
    (anonymous) @ main.js?1c90:1 
    (anonymous) @ app.js:1616 
    __webpack_require__ @ app.js:660 
    fn @ app.js:86 
    (anonymous) @ app.js:2368 
    __webpack_require__ @ app.js:660 
    (anonymous) @ app.js:709 
    (anonymous) @ app.js:712 
    

    답변

    0

    당신이 not-in-sw을보고있는 특정 오류가의 ServiceWorkerGlobalScope의 외부에서 workbox-sw 라이브러리에 노출 된 코드를 사용하기 때문입니다. 이는 예를 들어 서비스 종업원 코드를 <script> 또는 웹 작업자로 페이지에 가져 오는 경우에 발생합니다.

    내가 알려줄 수있는 가장 좋은 자료는 새로운 "Get Started With Workbox For Webpack"가이드입니다.