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:

- vue@2.6.14 (G:\workspace\BookShopManageVue\node_modules\vue\dist\vue.runtime.common.js)
- vue-template-compiler@2.7.10 (G:\workspace\BookShopManageVue\node_modules\_vue-template-compiler@2.7.10&#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 vue@2.6.14 --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

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npm install -save -dev style-loader@0.23.1
npm install -save -dev css-loader@2.0.2
npm install --save-dev less-loader@3.0.0 less
npm install -save -dev style-loader@0.23.1 npm install -save -dev css-loader@2.0.2 npm install --save-dev less-loader@3.0.0 less
npm install -save -dev style-loader@0.23.1
npm install -save -dev css-loader@2.0.2
npm install --save-dev less-loader@3.0.0 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 ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed. You must install peer dnpm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"dar
+ babel-plugin-component@1.1.1
added 4 packages from 3 contributors in 13.118s
 
F:\WebstormProjects\euw\esa>npm run dev
 
> esa@1.0.0 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 babel-preset-es2015@6.24.1: ????  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
npm WARN ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
 
+ babel-preset-es2015@6.24.1
added 1 package from 1 contributor in 9.707s
 
F:\WebstormProjects\euw\esa>