Webpack에서 UIkit을 사용할 수 없습니다.

webpack으로 프로젝트를 설정하기 만하면됩니다. 그냥 나는 고궁 박물원은 모든 것이 잘 작동 시작, 실행 내가 코드Webpack에서 UIkit을 사용할 수 없습니다.

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-beta.12/css/uikit.min.css" /> 
</head> 
<body> 

<ul uk-accordion> 
    <li class="uk-open"> 
     <h3 class="uk-accordion-title">Item 1</h3> 
     <div class="uk-accordion-content"> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     </div> 
    </li> 
    <li> 
     <h3 class="uk-accordion-title">Item 2</h3> 
     <div class="uk-accordion-content"> 
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor reprehenderit.</p> 
     </div> 
    </li> 
    <li> 
     <h3 class="uk-accordion-title">Item 3</h3> 
     <div class="uk-accordion-content"> 
      <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat proident.</p> 
     </div> 
    </li> 
</ul> 

<script src="dist/main.js"></script> 
</body> 
</html>

화이트 아래 쓰기 내 주요 HTML 파일에서

import 'jquery'; 
import 'uikit/dist/js/uikit.js';

를 사용하여 내 주요 JS 파일에 npm install uikit --save

와 uikit를 설치 .. 하지만 Uncaught ReferenceError : UIkit은 정의되지 않았습니다.

Error picture is here. click on me

나는 ... 도움을 주셔서 감사합니다없는 무엇.

출처

2017-02-23 Anam

'가져 오기 UIkit'uikit/dist/js/uikit.js ';'? –

시도했지만 작동하지 않습니다. 같은 문제. – Anam

내 github repo 링크는 https://github.com/anamwp/style-switcher입니다. – Anam

UIKit은 window 개체에 물건이 필요합니다. 그래서이 main.js에서 그것을 할 순진 방법이 될 수 있습니다

import Vue from 'vue'; 
import UIkit from 'uikit'; 
import Icons from 'uikit/dist/js/uikit-icons'; 
import jQuery from 'jquery'; 
import App from './App'; 

UIkit.use(Icons); 

window.jQuery = jQuery; 
window.UIkit = UIkit; 

module.exports = new Vue({ 
    router, 
    el: '#app', 
    template: '<App/>', 
    components: { App }, 
    store, 
});

대신, 더 나은 솔루션 this SO answer 당 같이 웹팩 설정을 편집 할 것으로 보인다. 그럼,이 작품은 나를 위해 :

{ 
    test: require.resolve('jquery'), 
    loader: 'expose-loader?jQuery!expose-loader?$' 
    }, 
    { 
    test: require.resolve('uikit'), 
    loader: 'expose-loader?UIkit' 
    }

출처

2017-04-02 15:55:35 allanberry

Webpack에서 UIkit을 사용할 수 없습니다.

답변

관련 문제