如何在Vue-js 2.x中使用插件？

我正在使用vue js 2.3.o版本。我想用插件來處理模態窗口，例如vue-js-modal（https://github.com/euvl/vue-js-modal）。如何在Vue-js 2.x中使用插件？

當我想要使用它時，我會將庫添加到我的頁面。

<script type="text/javascript" src="/lib/vuejs/index.js"></script>

我放在一個地方，我創造VUE實例本身之前：

import VModal from 'vue-js-modal'; 
Vue.use(VModal); 

var myVue = new Vue({

然後我看到：

SyntaxError: import declarations may only appear at top level of a module

我不知道它是什麼。哪裏不對？這個插件應該如何正確使用？

謝謝

來源

2017-10-06 squirrelInTheBarel

您的'import'語句位於文件的最頂端嗎？ – thanksd

它是帶有HTML內容的文件。我應該把它放？在上面？我做到了，結果相同 – squirrelInTheBarel

好像你要導入使用script標籤庫。根據vue-js-modal的說明，您必須使用npm install vue-js-modal --save進行安裝，然後使用import VModal from 'vue-js-modal'進行導入。

如果您使用script標籤導入模塊，你就必須寫：

<script src="vue-js-modal.js" type="module"></script>

HTML網頁上

。但是，現在，如果您想要在瀏覽器中導入模塊，則必須執行一些額外的步驟才能啓用此功能。（您可以按照這裏的說明：link）。

我建議查看演示vue-js-modal製作：link，它使用Babel和Webpack而不是隻導入script標籤。或者，當您設置Vue Web應用程序時，請使用他們的cli工具（link）來設置啓動器項目，然後安裝vue-js-modal。

來源

2017-10-07 06:22:38 kevguy

1.問題，我們需要在瀏覽器中啓用一些標誌。所以這不能用於某些商業網站。這將如何爲大量的客戶工作？我會在主頁上放置一些信息，請在您的瀏覽器中啓用此標誌和此標誌以使我們的頁面適合您？ – squirrelInTheBarel

2.問題。啓用此標誌後，錯誤消息消失。但我有另一個。我得到「TypeError：錯誤解析模塊說明符：vue-modal-js」。我的導入語句是「從'vue-modal-js'導入VModal;」我引用「」其中index.js是我從https://github.com/euvl/下載的文件VUE-JS-模式。我真的是JavaScript初學者，所以也許我錯過了這個概念的一些基本概念。謝謝 – squirrelInTheBarel

好的，我認爲'vue-js-modal.js'有一個ES6模塊，目前的瀏覽器不支持，除非你進行黑客攻擊，所以目前人們使用Webpack來處理它。就像我說的，看看演示'vue-js-modal'提供：https：//github.com/euvl/vue-js-modal/tree/master/demo，你可以看到他們的'index.html'使用了什麼是webpack捆綁的'build.js'文件。先嚐試運行示例，如果遇到任何問題，請告訴我。 – kevguy

如何在Vue-js 2.x中使用插件？

回答

相關問題