feat(webpackConfig): disable nodeIntegration by default

Author: nklayman

docs/guide/configuration.md

@@ -73,6 +73,20 @@ module.exports = {
 }
 ```
 
+## Node Integration
+
+As of v2.0, electron `nodeIntegration` is disabled by default. This blocks all node APIs such as `require`. This reduces [security risks](https://electronjs.org/docs/tutorial/security#2-do-not-enable-nodejs-integration-for-remote-content), and is a recommended best practice by the electron team. If you need to use native modules such as `fs` or `sqlite` in the renderer process, you can enable `nodeIntegration` in `vue.config.js`:
+
+```js
+module.exports = {
+  pluginOptions: {
+    electronBuilder: {
+      nodeIntegration: true
+    }
+  }
+}
+```
+
 ## Changing the Output Directory
 
 If you don't want your files outputted into dist_electron, you can choose a custom folder in vue-cli-plugin-electron-builder's plugin options. If you are using `v1.0.0-rc.4` or later, you can use the `--dest` argument to change the output dir as well.

docs/guide/guide.md

@@ -8,9 +8,9 @@ sidebarDepth: 2
 
 [[toc]]
 
-## Native Modules <Badge text="1.0.0-rc.1+" type="info"/>
+## Native Modules
 
-Native modules are supported and should work without any configuration. If you get errors, first make sure VCP-Electron-Builder's version is set to `1.0.0-rc.1` or greater. If it still fails, re-invoke the generator with `vue invoke electron-builder`. The generator will automatically detect missing code (such as native module support) and add it, without interfering with the rest. If you have done both these things, you may need to set the native dependency as an [webpack external](https://webpack.js.org/configuration/externals/). It should get found automatically, but it might not. To do this, use the `externals` option:
+Native modules are supported and should work without any configuration, assuming [nodeIntegration is enabled](./configuration.md#node-integration). If you get errors, you may need to set the native dependency as an [webpack external](https://webpack.js.org/configuration/externals/). It should get found automatically, but it might not. To do this, use the `externals` option:
 
 ```javascript
 // vue.config.js
@@ -31,7 +31,7 @@ module.exports = {
 
 - You can prefix an item in the `externals` array with `!` to prevent it being automatically marked as an external. (`!not-external`)
 
-- If you do not use native dependencies in your code, you can remove the `postinstall` script from your `package.json`. Native modules may not work, but dependency install times will be faster.
+- If you do not use native dependencies in your code, you can remove the `postinstall` and `postuninstall` scripts from your `package.json`. Native modules may not work, but dependency install times will be faster.
 
 - Using a database such as MySQL or MongoDB requires extra configuration. See [Issue #76 (comment)](https://github.com/nklayman/vue-cli-plugin-electron-builder/issues/76#issuecomment-420060179) for more info.
 

generator/templates/base/src/background.js

@@ -18,7 +18,9 @@ let win
 function createWindow () {
   // Create the browser window.
   win = new BrowserWindow({ width: 800, height: 600, webPreferences: {
-    nodeIntegration: true
+    // Use pluginOptions.nodeIntegration, leave this alone
+    // See nklayman.github.io/vue-cli-plugin-electron-builder/guide/configuration.html#node-integration for more info
+    nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION
   } })
 
   if (process.env.WEBPACK_DEV_SERVER_URL) {

index.js

@@ -561,6 +561,8 @@ function bundleMain ({
       envVars[k] = process.env[k]
     }
   })
+  // Enable/disable nodeIntegration
+  envVars.ELECTRON_NODE_INTEGRATION = pluginOptions.nodeIntegration || false
   config.plugin('env').use(webpack.EnvironmentPlugin, [envVars])
 
   if (args.debug) {

lib/webpackConfig.js

@@ -1,18 +1,18 @@
 const fs = require('fs')
 const { DefinePlugin } = require('webpack')
 
-async function chainWebpack (api, pluginOptions, config) {
+async function chainWebpack(api, pluginOptions, config) {
   const rendererProcessChain =
     pluginOptions.chainWebpackRendererProcess || (config => config)
   const realDirname = 'require("electron").remote.app.getAppPath()'
   if (process.env.IS_ELECTRON) {
-    // Add externals
-    config.externals(getExternals(api, pluginOptions))
-    //   Modify webpack config to work properly with electron
-    config
-      .target('electron-renderer')
-      .node.set('__dirname', false)
-      .set('__filename', false)
+    if (pluginOptions.nodeIntegration) {
+      // Add externals
+      config.externals(getExternals(api, pluginOptions))
+      //   Modify webpack config to work properly with electron
+      config.target('electron-renderer')
+    }
+    config.node.set('__dirname', false).set('__filename', false)
     // Set IS_ELECTRON
     if (config.plugins.has('define')) {
       config.plugin('define').tap(args => {
@@ -76,7 +76,7 @@ async function chainWebpack (api, pluginOptions, config) {
   process.env.VUE_APP_NODE_MODULES_PATH = false
 }
 // Find all the dependencies without a `main` property or with a `binary` property or set by user and add them as webpack externals
-function getExternals (api, pluginOptions) {
+function getExternals(api, pluginOptions) {
   const nodeModulesPath = pluginOptions.nodeModulesPath || './node_modules'
   let nodeModulesPaths = []
   if (Array.isArray(nodeModulesPath)) {