使用Webpack和Electron使用绝对路径导入

Import using absolute path using Webpack and Electron

本文关键字:路径 导入 Webpack Electron 使用      更新时间:2023-09-26

我正在尝试将具有绝对路径的文件导入到我的主电子线程中。

主电子线程中导入代码:

import * as Test2 from 'app/main/tray.js';

我已经添加了解析。Root到webpack.config:

{
  module: {
    loaders: [{
      test: /'.jsx?$/,
      loaders: ['babel-loader'],
      exclude: /node_modules/,
    }, {
      test: /'.json$/,
      loader: 'json-loader',
    }],
  },
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name]/index.js',
    libraryTarget: 'commonjs2',
  },
  resolve: {
    root: [
      path.resolve('./')
    ],
    extensions: ['', '.js', '.jsx'],
    packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main'],
  },
  plugins: [
  ],
  externals: [
    // put your node 3rd party libraries which can't be built with webpack here
    // (mysql, mongodb, and so on..)
  ],
};

当我运行webpack服务器时没有抛出错误(webpack发现文件很好),但是当我运行electron时抛出错误。

App threw an error during load
Error: Cannot find module 'app/main/tray.js'
    at Module._resolveFilename (module.js:440:15)
    at Function.Module._resolveFilename (C:'Git'stemn-electron-2'node_modules'electron-prebuilt'dist'resources'electron.asar'common'reset-search-paths.js:35:12)
    at Function.Module._load (module.js:388:25)
    at Module.require (module.js:468:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (index.js:22:15)
    at Module._compile (module.js:541:32)
    at loader (C:'Git'stemn-electron-2'node_modules'babel-register'lib'node.js:158:5)
    at Object.require.extensions.(anonymous function) [as .js] (C:'Git'stemn-electron-2'node_modules'babel-register'lib'node.js:168:7)
    at Module.load (module.js:458:32)
    at tryModuleLoad (module.js:417:12)
    at Function.Module._load (module.js:409:3)
    at loadApplicationPackage (C:'Git'stemn-electron-2'node_modules'electron-prebuilt'dist'resources'default_app.asar'main.js:288:12)
    at Object.<anonymous> (C:'Git'stemn-electron-2'node_modules'electron-prebuilt'dist'resources'default_app.asar'main.js:330:5)
    at Module._compile (module.js:541:32)
    at Object.Module._extensions..js (module.js:550:10)
npm ERR! Windows_NT 10.0.10586
npm ERR! argv "C:''Program Files''nodejs''node.exe" "C:''Users''david''AppData''Roaming''npm''node_modules''npm''bin''npm-cli.js" "run" "start-hot"
npm ERR! node v6.2.1
npm ERR! npm  v3.10.6
npm ERR! code ELIFECYCLE
npm ERR! STEMN@0.0.1 start-hot: `cross-env HOT=1 NODE_ENV=development electron -r babel-register -r babel-polyfill ./app/main/index`
npm ERR! Exit status 7
npm ERR!
npm ERR! Failed at the STEMN@0.0.1 start-hot script 'cross-env HOT=1 NODE_ENV=development electron -r babel-register -r babel-polyfill ./app/main/index'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the STEMN package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cross-env HOT=1 NODE_ENV=development electron -r babel-register -r babel-polyfill ./app/main/index
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs STEMN
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls STEMN
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR!     C:'Git'stemn-electron-2'npm-debug.log

看起来电子正在改变webpack导入行为?这些文件是在渲染窗口中正确导入的,而不是在主线程中…

你试过了吗:

root: [
     path.resolve(__dirname)
]

我的问题是我使用webpack来构建电子渲染器,但没有使用webpack来构建电子主线程。

我添加了一个新的webpack。现在我可以使用webpack了。Root(但是现在所有的代码都必须编译,这有点遗憾…)