目录
1. 全局安装vue的脚手架
命令行中运行(若没有安装yarn,请自行安装yarn)
yarn global add @vue/cli-init
2. 下载electron-vue的项目模板
electron-vue-start为项目名,可自定义为任意名称
vue init simulatedgreg/electron-vue electron-vue-start
按提示下载(若使用默认值则按回车键,选用 vue plugins时,选择 vue-electron,其他选择是否时可以都选no)
3. 指定依赖下载源
在 electron-vue-start 文件夹中新建文件 .yarnrc,内容如下
registry "https://registry.npm.taobao.org"
sass_binary_site "https://npm.taobao.org/mirrors/node-sass/"
phantomjs_cdnurl "http://cnpmjs.org/downloads"
electron_mirror "https://npm.taobao.org/mirrors/electron/"
sqlite3_binary_host_mirror "https://foxgis.oss-cn-shanghai.aliyuncs.com/"
profiler_binary_host_mirror "https://npm.taobao.org/mirrors/node-inspector/"
chromedriver_cdnurl "https://cdn.npm.taobao.org/dist/chromedriver"
4. 下载项目依赖
yarn
5. 修改配置文件
在 .electron-vue\webpack.renderer.config.js 和 .electron-vue\webpack.web.config.js 的 plugins 中,新增以下代码(两个文件都要改!)
templateParameters(compilation, assets, options) {
return {
compilation: compilation,
webpack: compilation.getStats().toJson(),
webpackConfig: compilation.options,
htmlWebpackPlugin: {
files: assets,
options: options
},
process,
};
},
具体位置如下图:
6. 启动项目
yarn dev
若项目启动成功,则会自动弹出下图
原文地址:https://blog.csdn.net/weixin_41192489/article/details/112627487
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。