Webpack import from %appdata%



我有一个电子应用程序需要读取存储在%appdata%中的文件(或macOS和Linux的等效文件(。我正在像这样导入文件

const appPath = app.getPath("appData");
const data = await import(appPath + "/app/file.json");

如果我从源文件运行代码,它可以工作,但是当我尝试将其与 webpack 捆绑在一起时,我收到Module not found错误。我知道这是由 webpack 尝试对我的导入进行分析引起的。

那么有没有办法在 webpack 中动态导入文件呢?

提前感谢!

编辑:我的 webpack 配置(没有 babel,因为我正在使用打字稿(

var path = require("path");
const CopyPlugin = require('copy-webpack-plugin');
var nodeExternals = require('webpack-node-externals');
module.exports = {
mode: 'production',
entry: "./src/index.ts",
externals: [nodeExternals()],
output: {
filename: "main.js",
path: path.resolve(__dirname, 'build')
},
node:{
__dirname:false
},
target: "electron-main",
resolve: {
alias: {
['firebase/app']: path.resolve(__dirname, 'node_modules/firebase/app/dist/index.cjs.js'),
['firebase']: path.resolve(__dirname, 'node_modules/firebase/dist/index.node.cjs.js')
}, extensions: ['.ts', '.js']
},
module: {
noParse: "/public/**/*",
rules: [
{
test: /.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/,
},
// {
//     test: /.json$/,
//     loader: 'json-loader'
// }
],
},
plugins: [
new CopyPlugin([
{ from: './src/public', to: './public' }
]),
]
}

通过查看文档,答案似乎在模块方法部分:

import(( 中的动态表达式

不能使用完全动态的导入语句,例如import(foo)。因为foo可能是系统或项目中任何文件的任何路径。

import()必须至少包含有关模块所在位置的一些信息。[...]

目前尚不清楚您是否需要在构建时或运行时读取它,如果是前者,请确保将文件复制到工作目录(以便该文件捆绑在构建中(,如果是后者,那么您可以使用fs模块在运行时获取文件。

也许您可以尝试动态导入并使用这样的承诺

import(appPath + "/app/file.json").then(data => {
console.log(data)
});

我想你不能,但NormalModuleRpelacementPlugin可能是你问题的解决方案。您可以在构建时使用它,但是例如,它可能取决于环境。

代码中的文件路径相同,但在构建后,它将随心所欲地更改。

https://webpack.js.org/plugins/normal-module-replacement-plugin/

最新更新