具有Vue的SSR并从node_modules加载到vue库中

Question

我使用Vue进行了SSR设置。回购中的vue组件似乎运行良好，但是当我从服务器端的node_modules中加载组件时，我得到：

server started at localhost:8080
error during render : /
D:\xampp\htdocs\lift\rentsync_website\node_modules\@rentsync\client-website-components\dist\components\molecules\menu\default\menu-default.vue:1
<template>
^

SyntaxError: Unexpected token '<'
   at wrapSafe (internal/modules/cjs/loader.js:1047:16)

我读到我将不得不使用汇总来配置位于node_modules中的组件库，以使其有可能正常工作。是真的吗？

如果没有，我的webpack.config如下：

const path = require('path')
const webpack = require('webpack')
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
const { VueLoaderPlugin } = require('vue-loader')
const StyleLintPlugin = require('stylelint-webpack-plugin');
const StyleLintConfigFile = './node_modules/@rentsync/client-website-core/dist/.stylelintrc.json'
const isProd = process.env.NODE_ENV === 'production'

module.exports = {
  mode: isProd
    ? 'production'
    : 'development',
  target: 'node',
  output: {
    path: path.resolve(__dirname, '../dist'),
    publicPath: '/dist/',
    filename: '[name].[chunkhash].js'
  },
  resolve: {
    alias: {
      'public': path.resolve(__dirname, '../public'),
      '@/': path.resolve(__dirname,'../src'),
      '@assets': path.resolve(__dirname, '../src/assets'),
      '@images': path.resolve(__dirname, '../src/assets/images'),
      '@pages': path.resolve(__dirname, '../src/pages'),
      '@components': path.resolve(__dirname, '../src/components'),
      '@error': path.resolve(__dirname, '../src/pages/Error/Error.vue'),
      '@layouts': path.resolve(__dirname, '../src/layouts'),

      '@footer': path.resolve(__dirname, '../src/layouts/Footer'),
      '@header': path.resolve(__dirname, '../src/layouts/Header'),

      '@molecules': path.resolve(__dirname, '../node_modules/@rentsync/client-website-components/dist/components/molecules'),
      '@atoms': path.resolve(__dirname, '../node_modules/@rentsync/client-website-components/dist/components/atoms'),
      '@organisms': path.resolve(__dirname, '../node_modules/@rentsync/client-website-components/dist/components/organisms'),

      'vue$': 'vue/dist/vue.esm.js'
    },
    modules: ['node_modules'],
    extensions: ['.js','.ts','.vue', '.scss'],

  },
  optimization: {

  },
  externals: {
    canvas: {
      commonjs: "canvas"
    }
  },
  module: {
    // noParse: /es6-promise\.js$/, // avoid webpack shimming process
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules\/(?!(@rentsync\/(client-website-core|client-website-components))\/).*/,
      },
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: '[name].[ext]?[hash]'
        }
      },
      {
        test: /\.s[ac]ss$/,
        use: [
          'vue-style-loader',
          'css-loader',
          'sass-loader',
          {
            loader: 'sass-resources-loader',
            options: {
              resources: [path.resolve(__dirname,'../src/styles/globals.scss'), path.resolve(__dirname,'../src/styles/main.scss')]
            },
          },
        ],
      },
      {
        test: /\.tsx?$/,
        loader: 'ts-loader',
        exclude: /node_modules\/(?!(@rentsync\/(client-website-core|client-website-components))\/).*/,
        options: {
          appendTsSuffixTo: [/\.vue$/],
          configFile: path.resolve(__dirname, "../tsconfig.json")
        }
      },
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        exclude: /node_modules\/(?!(@rentsync\/(client-website-core|client-website-components))\/).*/,
        options: {
          loaders: {
            ts: 'ts-loader'
          }
        }
      },
    ]
  },
  performance: {
    hints: false
  },
  plugins: isProd
    ? [
        new StyleLintPlugin({
          configFile: StyleLintConfigFile,
          fix: true,
        }),
        new VueLoaderPlugin(),
        new webpack.optimize.ModuleConcatenationPlugin()
      ]
    : [
        new StyleLintPlugin({
          configFile: StyleLintConfigFile,
          fix: true,
        }),
        new VueLoaderPlugin(),
        new FriendlyErrorsPlugin()
      ]
}