Webpack 和 vue-loader 與依賴項一起工作

Question

我有一個私有構建的依賴項，它在我的項目中編譯為 commonjs。

在依賴項本身中，它引用了我項目中的一個文件，一個 vue 文件。 在使用 webpack 構建並使用 ssr 后，似乎有問題。 加載vue文件失敗。

為清楚起見，文件夾結構：

node_modules
    |
    |- dependency
           |
           |-main.js
src
 |
 |-pages
     |
     |-Default.vue
dist
 |
 |-compiledcode.js <- what webpack compiles

現在在依賴項的 main.js 中，我有const vuefile = require('../../src/pages/Default.vue')

通過 ssr 托管 Node 后顯示的錯誤：

<template>
^

SyntaxError: Unexpected token '<'

在我的 webpack 中，我有以下內容：

module.exports = {
  ...
  module: {    
       rules: [
          {
           test: /\.vue$/,
           loader: 'vue-loader',        
          },
          ...
       ]
   },
   plugins: [
      new VueLoaderPlugin()
      ...
   ]
}

根據我的理解，錯誤是 vue-loader 沒有加載到文件中。 但我什至不知道這是否可能開始。 如果可以對此進行澄清。

如果不可能..

然后是否可以將 webconfig 添加到依賴項並使其以這種方式工作？ 如果是這樣，我如何讓我的 webpack 與依賴項 webpack 交互。

謝謝。

Answer 1

你能展示你的整個配置嗎？

1. 設置webpack 解析（包括擴展解析）
2. vue 是否包含在 main.js 中？ （導入vue..）
3. 設置別名以防止像'../../src/pages/..'這樣的路徑