Блог

Я перехожу на vuejs 2, и у меня очень своеобразная проблема с моими компонентами vue. Когда я запрашиваю () компонент, я получаю следующую ошибку в процессе объединения webpack:

 ERROR in Unexpected token >
  

Номер строки для ошибки — это то место, где вызов require() должен загрузить компонент.

Вот пример тестового компонента, для которого я получаю ошибку:

 <template>
    <div>
        <button>test</button>
    </div>
</template>

<script>
    module.exports = {
        data: function () {
            return {

            }
        }
    }
</script>
  

Мой webpack.config.js файл является:

 const webpack = require('webpack');
require('es6-promise').polyfill();
var path = require("path");

module.exports = {
    entry: {
        ...
    },
    output: {
        //path: path.join(__dirname, "./dist/js"),
        path: './',
        filename: "[name].bundle.js",
        chunkFilename: "[id].chunk.js"
    },
    devServer: {
        ...
    },
    module: {
        loaders: [
            {
                test: /.vue$/,
                loader: 'vue'
            },
            {
                test: /.js$/,
                loader: 'babel-loader',
                // make sure to exclude 3rd party code in node_modules
                exclude: /node_modules/
            },
            {
                test: /.css$/,
                loader: "style-loader!css-loader"
            },
            {
                test: /.(jpe?g|png|gif|svg)$/i,
                loaders: [
                    'file?hash=sha512amp;digest=hexamp;name=[hash].[ext]',
                    'image-webpack?bypassOnDebugamp;optimizationLevel=7amp;interlaced=false'
                ]
            },
            {
                test: /.(eot|svg|ttf|woff|woff2)$/,
                loader: 'file?name=public/fonts/[name].[ext]'
            }
        ]
    },
    vue: {
        loaders: {
            js: 'babel-loader'
        }
    },
    resolveLoader: {
        root: __dirname   '/node_modules'
    },
    resolve: {
        alias: {
            'vue': 'vue/dist/vue'
        }
    }
};
  

Любая помощь будет очень признательна. Я был в тупике по этому поводу уже несколько часов.

Я действительно понял это. Скорее, я выяснил, что было не так, и как это обойти. В принципе, интеграция Visual Studio webpack с task runner больше не работает с vue 2. Я понятия не имею, почему. Однако простое выполнение команд из командной строки работает отлично и в любом случае намного проще.