electron系列-01： electron-vue安装

electron-vue安装

1、安装node环境

2、安装vue-cli

npm install -g @vue/cli

3、创建electron-vue项目

vue init simulatedgreg/electron-vue my-project

4、下载第三方库并运行

(1) 下载第三方依赖。cnpm install
(2) 运行。npm run dev

5、electron-vue ReferenceError process is not defined问题

（1） 找到根目录下的.electron-vue目录

（2） 找到该目录下的webpack.renderer.config.js文件，找到这段代码：

new HtmlWebpackPlugin({// ...
})替换为：
new HtmlWebpackPlugin({filename: 'index.html',template: path.resolve(__dirname, '../src/index.ejs'),minify: {collapseWhitespace: true,removeAttributeQuotes: true,removeComments: true},templateParameters(compilation, assets, options) {return {compilation: compilation,webpack: compilation.getStats().toJson(),webpackConfig: compilation.options,htmlWebpackPlugin: {files: assets,options: options},process,};},nodeModules: process.env.NODE_ENV !== 'production'? path.resolve(__dirname, '../node_modules'): false}),

（3） 再找到该目录下的webpack.web.config.js文件，找到这段代码：

new HtmlWebpackPlugin({// ...
})替换为：
new HtmlWebpackPlugin({filename: 'index.html',template: path.resolve(__dirname, '../src/index.ejs'),templateParameters(compilation, assets, options) {return {compilation: compilation,webpack: compilation.getStats().toJson(),webpackConfig: compilation.options,htmlWebpackPlugin: {files: assets,options: options},process,};},minify: {collapseWhitespace: true,removeAttributeQuotes: true,removeComments: true},nodeModules: false
}),

（4）然后npm run dev 运行程序即可。