【electron-vue】 一、elecron-vue 环境搭建

一、环境搭建

1.1 创建项目

# 安装脚手架
npm install -g vue-cli

# 安装脚手架样板项目
vue init simulatedgreg/electron-vue elec-demo01

 

1.2 Webpack ReferenceError:process is not defined 错误处理

在执行 npm install 命令时，可能会报错，需要修改 webpack 配置文件

错误内容：

ERROR in Template execution failed: ReferenceError: process is not defined
  
  ERROR in   ReferenceError: process is not defined
    
    - index.ejs:11 eval
      [.]/[html-webpack-plugin]/lib/loader.js!./src/index.ejs:11:2
    
    - index.ejs:16 module.exports
      [.]/[html-webpack-plugin]/lib/loader.js!./src/index.ejs:16:3

解决方案：

修改.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
}),