您可能需要一个合适的加载器来处理这种文件类型。它不允许 html 进入 node_modules

Question

我正在使用简单的 vue 项目，我添加了一个名为 vue add electron-builder 的附加包，我的目标是每当我打开我的电子应用程序时触发 server.js 文件。我在 server.js file.i 内有 pouchdb express，在 backround.js.i 内调用 server.js 知道我由于 babel 而面临错误，但我不知道如何在我的项目中配置。

vue.config.js

module.exports = {
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        win: {
          icon: './public/icon.ico'
        }
      }
    }
  }
}

babel.config.js

module.exports = {
 sourceType: 'unambiguous',
  presets: [
    '@vue/cli-plugin-babel/preset'
  ],
  ignore: [
    'src/entities/*'
]
}

我遇到错误

错误编译失败，有 1 个错误7:50:46PM

 error  in **./node_modules/pouchdb-fauxton/www/index.html**<---this file is not allowing

模块解析失败：意外的标记 (1:0) 您可能需要一个合适的加载程序来处理这种文件类型，目前没有配置任何加载程序来处理这种文件。参见 https://webpack.js.org/concepts#loaders

> <!doctype html>
| <html lang="en">
| <head>

 @ ./node_modules/express-pouchdb/lib/routes/fauxton.js 7:32-66
 @ ./node_modules/express-pouchdb/lib sync ^\.\/.*$
 @ ./node_modules/express-pouchdb/lib/index.js
 @ ./backend_db/server.js
 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/vuetify-loader/lib/loader.js??ref--18-0!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
 @ ./src/App.vue?vue&type=script&lang=js&
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

Answer 1

我认为错误消息很容易解释：您需要为 html 个文件添加 webpack 加载器。

npm install --save-dev html-loader

然后在vue.config.js:

module.exports = {
    chainWebpack: config => {
        config.module
          .rule('html')
          .test(/\.html$/)
          .use('html-loader')
          .loader('html-loader')
      }
}

您可能需要一个合适的加载器来处理这种文件类型。它不允许 html 进入 node_modules

You may need an appropriate loader to handle this file type. it does not allow html inside node_modules

vue.js

babeljs

pouchdb

babel-loader