操作系统windows
第一步:安装node.js
下载LTS版,安装完成后,打开cmd输入node -v,会弹出node.js版本(安装成功)
第二步:安装vue-cli
如果电脑里没有安装vue-cli,全局安装:
npm install -g vue-cli
第三步:安装electron-vue模板
vue init simulatedgreg/electron-vue my-project
my-project:项目文件夹路径
第四步:安装依赖
进入项目文件夹下安装依赖
cd my-project
npm install
第五步:进入开发模式
npm run dev
一切都顺利的话,会弹出下图
第六步:报错处理
在实际安装过程中,可能会碰上各种各样的问题,需要大家自行谷歌或者百度解决
下面说一个我在安装过程遇上的报错:
npm run dev 之后,弹出下图界面
报错:ERROR in Template execution failed: ReferenceError: process is not defined
处理方法:
修改my-project文件下.electron-vue/webpack.web.config.js和.electron-vue/webpack.renderer.config.js文件的HtmlWebpackPlugin,添加templateParameters
修改后如下:
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
}),
参考:
https://segmentfault.com/a/1190000019487488
https://www.jianshu.com/p/bdf0a23e7257