'；Vue'；在我的自定义ShopWare 6 Javascript插件中未定义

Vue.js添加到我的头标签中：

我正在将一些自定义Vue逻辑构建到我的系统中（还没有Vue店面）

在我的自定义ShopWare 6文件

vue输入编号/vue输入编号.plugin.js

中，我有：

import Plugin from 'src/plugin-system/plugin.class';

export default class VueInputNumber extends Plugin {
    init() {

        window.Vue = Vue;

        const App = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!',
            },
            delimiters: ['[[',']]'],
        })
    }
}

当我编译这个

.js

文件

/psh.phar storefront:build

时，我得到一个错误：

error  'Vue' is not defined                      no-undef
error  'App' is assigned a value but never used  no-unused-vars
error  'Vue' is not defined                      no-undef

---

我必须做什么才能在Javascript文件中创建新的Vue实例？

我认为您在那里遇到了一些ESLint错误，因为店面中的Shopware 6 webpack配置不知道Vue。您可以尝试将

Vue

添加到

.eslintrc

：

// platform/src/Storefront/Resources/app/storefront/.eslintrc.js
module.exports = {
    // ...

    'globals': {
        'gtag': true,
        'Vue': true <-- Add Vue here
    },

    // ...
};

---

头标记中的

/dist/vue.js

文件之前是否添加了

vue输入编号/vue输入编号.plugin.js

文件？否。vue.js位于

标记中

vue输入编号/vue输入编号.plugin.js

应编译为标签下方的all.js。当我想编译这个新的.js文件时，我遇到了这个错误。好的，谢谢，这很有意义。我可以在自定义插件custom/plugins/MyPlugin/src/Resources/app/storefront/src中创建一个新的

.eslintrc.js

文件吗？关于您的示例：

'Vue'：true
// eslint-disable-next-line
const App = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!',
    },
    delimiters: ['[[',']]'],
})