Question

我想在我的vue.js应用程序中包含一个简单的javascript脚本，该脚本具有指向该库的外部链接：

<script type="text/javascript" src="https://my_site/index.js"></script>
 <link rel="stylesheet" href="https://my_site/index.css" />

 <script type="text/javascript">
     document.addEventListener('DOMContentLoaded', function () {
         new Pbx(
             {
                 "key1": 'value1',
                 "key2": 'value2'
             },
             {
                 'config': 'configValue'
             }
         );
     });
 </script>

我有这个main.js文件，我想将脚本保留在外部：

    import Vue from 'vue';
    import VModal from 'vue-js-modal';
    import App from './App.vue';
    import router from './router';
    import store from './store';
    import i18n from './i18n';
    import VueScrollactive from 'vue-scrollactive';
    import VTooltip from 'v-tooltip';

    import './styles/index.scss';

    export default new Vue({
      el: '#myApp',
      store,
      router,
      i18n,
      render: h => h(App),
    });

我想知道如何以一种很好的方式包括我的库，我试图在这里包括我的javascrupt，但是我不太喜欢它。

谢谢

Answer 1

我记得我曾经使用过jQuery，而没有在npm中安装它，只要您将jQuery的<script>标记放在生成文件的script标记的顶部即可，也许可以在您的应用程序内部访问jQuery的$变量。

您可以执行类似为要访问的变量创建单独的.js文件的操作。只要正确放置脚本标签，就可以在整个应用中访问let pbx = new Pbx(data)和pbx数据。

尽管有一件事，document.addEventListener('DOMContentLoaded')可能会干扰vue，但是如果您想访问pbx组件的mounted生命周期，可以访问App变量立即

将外部脚本添加到vue.js

1 个答案: