Webpack 找不到模块 'electron'
Webpack cannot find module 'electron'
我正在尝试开发一个基于 this tutorial
的小电子 angular2 应用程序
似乎他们在捆绑 webpack 时出现了一些错误,因为我无法 require/import 我的渲染器组件中的电子遥控器。
在我的 AppComponent 中,我执行以下操作
import {remote} from 'electron';
我的 Webpack 配置
var path = require('path');
var webpack = require('webpack');
var CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
var webpackTargetElectronRenderer = require('webpack-target-electron-renderer');
var config = {
debug: true,
devtool: 'source-map',
entry: {
'angular2': [
'rxjs',
'reflect-metadata',
'angular2/core',
'angular2/router',
'angular2/http'
],
'app': './src/app/renderer/bootstrap'
},
output: {
path: __dirname + '/build/',
publicPath: 'build/',
filename: '[name].js',
sourceMapFilename: '[name].js.map',
chunkFilename: '[id].chunk.js'
},
resolve: {
extensions: ['','.ts','.js','.json', '.css', '.html'],
packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main']
},
module: {
loaders: [
{
test: /\.ts$/,
loader: 'ts',
exclude: [ /node_modules/ ]
}
]
},
plugins: [
new CommonsChunkPlugin({ name: 'angular2', filename: 'angular2.js', minChunks: Infinity }),
new CommonsChunkPlugin({ name: 'common', filename: 'common.js' })
]
};
config.target = webpackTargetElectronRenderer(config);
module.exports = config;
Webpack 抛出如下错误
ERROR in ./src/app/renderer/components/app/app.ts
(1,22): error TS2307: Cannot find module 'electron'.
解决了
const electron = require('electron');
const remote = electron.remote;
您是 TypeScript 的新手吗?你安装了吗?您可以通过以下方式安装它:
npm install -g typescript
你的解决方案是 java 脚本解决方案,如果你正在寻找它,这是一个不错的 hack,但如果你想使用 TypeScript,那么你应该能够使用 'import'。
完成教程:
https://www.npmjs.com/package/typescript
另外,检查:
尝试将 target: "electron-renderer"
添加到 webpack 配置中 module.exports
对象的底部。 (我的是通过 ng eject
通过 Angular CLI 创建的)
我正在尝试开发一个基于 this tutorial
的小电子 angular2 应用程序似乎他们在捆绑 webpack 时出现了一些错误,因为我无法 require/import 我的渲染器组件中的电子遥控器。
在我的 AppComponent 中,我执行以下操作
import {remote} from 'electron';
我的 Webpack 配置
var path = require('path');
var webpack = require('webpack');
var CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
var webpackTargetElectronRenderer = require('webpack-target-electron-renderer');
var config = {
debug: true,
devtool: 'source-map',
entry: {
'angular2': [
'rxjs',
'reflect-metadata',
'angular2/core',
'angular2/router',
'angular2/http'
],
'app': './src/app/renderer/bootstrap'
},
output: {
path: __dirname + '/build/',
publicPath: 'build/',
filename: '[name].js',
sourceMapFilename: '[name].js.map',
chunkFilename: '[id].chunk.js'
},
resolve: {
extensions: ['','.ts','.js','.json', '.css', '.html'],
packageMains: ['webpack', 'browser', 'web', 'browserify', ['jam', 'main'], 'main']
},
module: {
loaders: [
{
test: /\.ts$/,
loader: 'ts',
exclude: [ /node_modules/ ]
}
]
},
plugins: [
new CommonsChunkPlugin({ name: 'angular2', filename: 'angular2.js', minChunks: Infinity }),
new CommonsChunkPlugin({ name: 'common', filename: 'common.js' })
]
};
config.target = webpackTargetElectronRenderer(config);
module.exports = config;
Webpack 抛出如下错误
ERROR in ./src/app/renderer/components/app/app.ts
(1,22): error TS2307: Cannot find module 'electron'.
解决了
const electron = require('electron');
const remote = electron.remote;
您是 TypeScript 的新手吗?你安装了吗?您可以通过以下方式安装它:
npm install -g typescript
你的解决方案是 java 脚本解决方案,如果你正在寻找它,这是一个不错的 hack,但如果你想使用 TypeScript,那么你应该能够使用 'import'。
完成教程: https://www.npmjs.com/package/typescript
另外,检查:
尝试将 target: "electron-renderer"
添加到 webpack 配置中 module.exports
对象的底部。 (我的是通过 ng eject
通过 Angular CLI 创建的)