使用electron-vue 报错 ReferenceError

2020-03-28  本文已影响0人  隔壁大胸弟

在node版本为12.x.x的时候运行electron-vue,会导致报错,报错如下:

image.png
Html WebpackPlugin:
  ReferenceError: process is not defined

在翻阅无数简书和CSDN发现答案都是一样的,且是一样的无效!

最后再GitHub的issue中发现正解!!!答案很简单
这里是issue链接,自己可以找找看

先修改 .electron-vue/webpack.web.config.js文件

// webpack.web.config.js
new HtmlWebpackPlugin({
      filename: 'index.html',
      template: path.resolve(__dirname, '../src/index.ejs'),
      minify: {
        collapseWhitespace: true,
        removeAttributeQuotes: true,
        removeComments: true
      },
      isBrowser: false,
      isDevelopment: process.env.NODE_ENV !== 'production',
      nodeModules: process.env.NODE_ENV !== 'production'
        ? path.resolve(__dirname, '../node_modules')
        : false
    }),

在src/index.ejs中修改为如下:

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <% if (htmlWebpackPlugin.options.nodeModules) { %>
        <!-- Add `node_modules/` to global paths so `require` works properly in development -->
        <script>
          require('module').globalPaths.push('<%= htmlWebpackPlugin.options.nodeModules.replace(/\\/g, '\\\\') %>')
        </script>
    <% } %>
</head>
<body>

<div id="app">
</div>

<!-- Set `__static` path to static files in production -->
<% if (!htmlWebpackPlugin.options.isBrowser && !htmlWebpackPlugin.options.isDevelopment) { %>
    <script>
      window.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
    </script>
<% } %>

<!-- webpack builds are automatically injected -->
</body>
</html>

亲测有效!

上一篇下一篇

猜你喜欢

热点阅读