programing

Requirejs에서 Vue.js를 사용하는 방법

nicescript 2022. 8. 9. 22:19
반응형

Requirejs에서 Vue.js를 사용하는 방법

샘플을 생성했습니다.Vue.js을 사용하여 투영하다vue-cli에 의해 구축되었습니다.

vue build --target lib --name myWidget src/main.js 

사용해야 합니다.Requirejs로드하려면:

    <script>
        requirejs.config({
            paths: {
                "Vue": "https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue",
                "myWidget": "https://codematic.tech/yamaWidget.umd",
            }
        });
    </script>
    <script>
        require(["Vue"], function (Vue) {
            console.log('Vue loaded');
            require(["myWidget"], function (widget) {
                console.log('Widget loaded');
            });
        });
    </script>

작동해야 할 것 같은데 오류가 발생했습니다.

TypeError: Cannot read property 'config' of undefined

그 점을 가리키고 있다

Vue.config.productionTip = false

소스코드로 변환됩니다.나는 그것을 더해서 간신히 고쳤다Vue = window.Vue;Vue의 main.js 파일에 저장하여window.Vue = Vue<script>태그, 요구 후Vue. 라이브러리 로드 중, 마운트 위치#app이상하게 생겼지만 효과가 있다.

문제는 Vue에서 무언가를 Import할 때main.js파일. 예를 들어,import Snotify from 'vue-snotify';다음 오류가 나타납니다.

Cannot read property 'extend' of undefined

이 점에 대해 설명하겠습니다.

var script = external_commonjs_vue_commonjs2_vue_root_Vue_default.a.extend({

참고로 Vue.js와 myWidget.umd.js를 모두 직접 로드하면<script>태그, 모든 게 잘 되고 있어!

해결했습니다. 문제는 외부 라이브러리입니다.vue-snotify이 문제의 원인이 되었습니다.

언급URL : https://stackoverflow.com/questions/54957622/how-to-use-vue-js-with-requirejs

반응형