Module not found: Error: Can't resolve element-plus/es/components/button/style/css

error¶

When developing a Chrome extension, it relies on element-plus. Want to experience the benefits of on-demand loading, so I used this package: unplugin-element-plus/webpack, the introduction method is as follows

const ElementPlus = require('unplugin-element-plus/webpack').default;

plugins: [
      // ...
      ElementPlus(),
    ],

When compiling, I get an error:

Module not found: Error: Can't resolve element-plus/es/components/button/style/css

solution¶

Follow the path provided in the error report to enter the package to see, the extension does not have resources of .js So amended here:

 resolve: {
      extensions: ['.ts', '.js', '.vue', '.json', '.mjs'],
      // ...
}

Added .mjs, so far the problem is solved.

Attachement

Partly dependent package version:

{
  "dependencies": {
    "element-plus": "^1.2.0-beta.6",
    "unplugin-element-plus": "^0.1.3",
    "vue": "^3.2.20",
    "vue-class-component": "^7.1.0",
    "vue-property-decorator": "^8.3.0"
  },
  "devDependencies": {
    "webpack": "^5.65.0",
    "webpack-cli": "^4.9.1",
  }
}