Tag Archives: Module build failed

[Solved] Module build failed: Error: Vue packages version mismatch

Leave a reply

1. Error message when running the project

Module build failed: Error:

Vue packages version mismatch:

- [email protected] (G:\workspace\BookShopManageVue\node_modules\vue\dist\vue.runtime.common.js)
- [email protected] (G:\workspace\BookShopManageVue\node_modules\[email protected]&#64 ;vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template- compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

2. Reason for the error

version problems,

The currently installed VUE dependency node_modules is version 2.6.14,  but the imported project uses version 2.7.10.

Just unify the two versions.

Hint: how to unify versions. Is to download and install version 2.6.14. Still version 2.7.10?

If you are using vue-loader@>=10.0, simply update vue-template-compiler.

Check the version of vue loader in package-lock.json. My vue loader version is higher than 10. So I’m going to unity 1.6.14 version. (I didn’t see vue loader directly download and install version 2.7.10 before. The result is the same error)
insert image description here

3. Solutions

  • 1. Delete node_modules
  • 2. Install npm install [email protected] --save (Need to check the version)

4. Successful operation

insert image description here

[Solved] Module build failed TypeError this.getOptions is not a function at Object.loader

How to Solve error: Module build failed TypeError this.getOptions is not a function at Object.loader

Solution: Reduce the current style-loader version

npm install -save -dev [email protected]
npm install -save -dev [email protected]
npm install --save-dev [email protected] less

Module build failed: Error: Couldn’t find preset “es2015” relative to directory

Leave a reply

1. Error description

F:\WebstormProjects\euw\esa>npm install babel-plugin-component -D
npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dnpm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"dar
+ [email protected]
added 4 packages from 3 contributors in 13.118s
 
F:\WebstormProjects\euw\esa>npm run dev
 
> [email protected] dev F:\WebstormProjects\euw\esa
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
 
 94% asset optimization
 
 ERROR  Failed to compile with 2 errors                                                                                                                                                                                          16:10:44
 
 error  in (webpack)-dev-server/client?http://localhost:8081
 
Module build failed: Error: Couldn't find preset "es2015" relative to directory "F:\\WebstormProjects\\euw\\esa"
    at F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
    at Array.map ()
    at OptionManager.resolvePresets (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at File.initOptions (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (F:\WebstormProjects\euw\esa\node_modules\babel-loader\lib\index.js:50:20)
    at Object.module.exports (F:\WebstormProjects\euw\esa\node_modules\babel-loader\lib\index.js:173:20)
 
 @ multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js
 
 error  in ./src/main.js
 
Module build failed: Error: Couldn't find preset "es2015" relative to directory "F:\\WebstormProjects\\euw\\esa"
    at F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
    at Array.map ()
    at OptionManager.resolvePresets (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at File.initOptions (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (F:\WebstormProjects\euw\esa\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (F:\WebstormProjects\euw\esa\node_modules\babel-loader\lib\index.js:50:20)
    at Object.module.exports (F:\WebstormProjects\euw\esa\node_modules\babel-loader\lib\index.js:173:20)
 
 @ multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js

2. The reason for the error

The contents of the .babelrc file

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"]
}

To

{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

3. Solution

Execute the following command:

npm install --save-dev babel-preset-es2015

F:\WebstormProjects\euw\esa>npm install --save-dev babel-preset-es2015
npm WARN deprecated [email protected]: ????  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
 
+ [email protected]
added 1 package from 1 contributor in 9.707s
 
F:\WebstormProjects\euw\esa>