title: Why vue-cli-3 won't build, "can't find 'wepack'"?
body: <p>Since recently got this error when trying to run <code>npm run build</code> saying webpack could not be found in the mini-css-extract-plugin. I can't figure out what I've might have changed to cause it.</p>
  
  <p>I've created a release branch recently, but I don't have a lot of changes (in the package.json) compared the master branch where the build still works. However a few weeks ago (before my holidays) it still worked and I can't get my finger on the problem.</p>
  
  <h3>Also here is the initial Error:</h3>
  
  <pre><code>Error: Cannot find module 'webpack'
      at Function.Module._resolveFilename (module.js:538:15)
      at Function.Module._load (module.js:468:25)
      at Module.require (module.js:587:17)
      at require (internal/module.js:11:18)
      at Object.&lt;anonymous&gt; (D:\EnviDat\Frontend\envidat_frontend\node_modules\mini-css-extract-plugin\dist\index.js:8:39)
      at Module._compile (module.js:643:30)
      at Object.Module._extensions..js (module.js:654:10)
      at Module.load (module.js:556:32)
      at tryModuleLoad (module.js:499:12)
      at Function.Module._load (module.js:491:3)
      at Module.require (module.js:587:17)
      at require (internal/module.js:11:18)
      at Object.&lt;anonymous&gt; (D:\EnviDat\Frontend\envidat_frontend\node_modules\mini-css-extract-plugin\dist\cjs.js:3:18)
      at Module._compile (module.js:643:30)
      at Object.Module._extensions..js (module.js:654:10)
      at Module.load (module.js:556:32)
  </code></pre>
  
  <p>I've have tried install the dependencies in the node_modules\mini-css-extract-plugin folder manually via <code>npm install</code>, but then I've just got other dependencies which couldn't be loaded. When installing the them.</p>
  
  <h3>I ended up when I've got the following error:</h3>
  
  <pre><code>Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
  Thread Loader (Worker 0)
  Failed to load plugin import: Cannot find module 'eslint-plugin-import'
  Referenced from: D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\@vue\eslint-config-airbnb\node_modules\eslint-config-airbnb-base\index.js
  Referenced from: D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\@vue\eslint-config-airbnb\index.js
  Referenced from: D:\EnviDat\Frontend_develop\envidat_frontend\.eslintrc.js
      at PoolWorker.fromErrorObj (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\thread-loader\dist\WorkerPool.js:262:12)
      at D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\thread-loader\dist\WorkerPool.js:204:29
      at mapSeries (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\thread-loader\node_modules\neo-async\async.js:3625:14)
      at Function.Module._resolveFilename (module.js:538:15)
      at Function.resolve (internal/module.js:18:19)
      at Plugins.load (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\plugins.js:104:29)
      at Array.forEach (&lt;anonymous&gt;)
      at Plugins.loadAll (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\plugins.js:165:21)
      at loadFromDisk (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\config-file.js:529:35)
      at load (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\config-file.js:587:20)
      at configExtends.reduceRight (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\config-file.js:453:36)
      at Array.reduceRight (&lt;anonymous&gt;)
      at applyExtends (D:\EnviDat\Frontend_develop\envidat_frontend\node_modules\eslint\lib\config\config-file.js:431:26)
  
   @ multi ./src/main.js
  </code></pre>
  
  <p>At which point I'm lost, I could figure out anything online, so I've reinstall all the node_modules, still the same result. Also I've tried to go a clean install with <code>npm ci</code>, still the same problem.</p>
  
  <h3>I can't figure it out why the error happens and what to change to make it work again</h3>
  
  <p>The dependencies in the package.json:</p>
  
  <pre><code>  "dependencies": {
      "axios": "^0.19.0",
      "babel-polyfill": "^6.26.0",
      "core-js": "^2.6.5",
      "leaflet": "^1.5.1",
      "leaflet.gridlayer.googlemutant": "^0.7.0",
      "m-markdown-preview": "^1.0.0",
      "material-design-icons-iconfont": "*",
      "seedrandom": "^2.4.3",
      "skeleton-placeholder": "^1.0.0",
      "ssri": "^5.3.0",
      "vue": "^2.6.10",
      "vue-infinite-loading": "^2.4.4",
      "vue-router": "^3.0.3",
      "vue2-filters": "^0.7.0",
      "vuetify": "^1.5.5",
      "vuex": "^3.0.1",
      "vuex-localstorage": "^1.0.0"
    },
    "devDependencies": {
      "@mdi/font": "^3.8.95",
      "@storybook/addon-actions": "^4.1.0 || ^5.0.0",
      "@storybook/addon-knobs": "^4.1.0 || ^5.0.0",
      "@storybook/addon-links": "^4.1.0 || ^5.0.0",
      "@storybook/addon-notes": "^4.1.0 || ^5.0.0",
      "@storybook/addon-viewport": "^5.1.9",
      "@vue/cli-plugin-babel": "^3.9.0",
      "@vue/cli-plugin-eslint": "^3.9.2",
      "@vue/cli-service": "^3.9.0",
      "@vue/eslint-config-airbnb": "^4.0.0",
      "babel-eslint": "^10.0.1",
      "css-loader": "^3.1.0",
      "eslint": "^5.16.0",
      "eslint-import-resolver-babel-module": "^5.1.0",
      "eslint-plugin-vue": "^5.0.0",
      "node-sass": "^4.12.0",
      "postcss-import": "^12.0.1",
      "postcss-loader": "^3.0.0",
      "postcss-url": "^8.0.0",
      "sass-loader": "^7.1.0",
      "style-loader": "^0.23.1",
      "stylus": "^0.54.5",
      "stylus-loader": "^3.0.2",
      "vue-cli-plugin-storybook": "^0.6.1",
      "vue-cli-plugin-vuetify": "^0.5.0",
      "vue-template-compiler": "^2.6.10",
      "vuetify-loader": "^1.0.5"
    },
  </code></pre>
  
  <p>The the full package.json is here:
  <a href="https://github.com/EnviDat/envidat_frontend/blob/release/Navigation_integration/package.json" rel="nofollow noreferrer">https://github.com/EnviDat/envidat_frontend/blob/release/Navigation_integration/package.json</a></p>
  
  <p>And the vue.config.js:</p>
  
  <pre><code>module.exports = {
    publicPath: './',
    assetsDir: './static',
    runtimeCompiler: true,
    css: {
      modules: false,
      sourceMap: true,
    },
    pluginOptions: {
      storybook: {
        allowedPlugins: ['define'],
      },
    },
  };
  </code></pre>
  
  <h2>How do I need to change the dependencies or config to make it build again?</h2>