Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-import' (Vue 2)

16,818

You can try:

npm install --save-dev postcss-import
Share:
16,818

Related videos on Youtube

AgainstTheSun
Author by

AgainstTheSun

Updated on July 10, 2022

Comments

  • AgainstTheSun
    AgainstTheSun almost 2 years

    I create my first npm package. I published it on npmjs and encountered the error of the lack of the 'postcss-import' module after installing the package in the project and running it. Tell me, where and in which file may the problem be? I tried all the ways and nothing works.Maybe something is wrong with these files?

    This is the 'package.json' file of my package

    {
      "_from": "some_package",
      "_inBundle": false,
      "_integrity": "sha512-***",
      "_location": "/some_package",
      "_phantomChildren": {},
      "_requested": {
        "type": "tag",
        "registry": true,
        "raw": "some_package",
        "name": "some_package",
        "escapedName": "some_package",
        "rawSpec": "",
        "saveSpec": null,
        "fetchSpec": "latest"
      },
      "_requiredBy": [
        "#USER",
        "/"
      ],
      "_resolved": "https://registry.npmjs.org/some_package/-/some_package-1.0.1.tgz",
      "_shasum": "***",
      "_spec": "some_package",
      "_where": "/home/user/vue/projects/package_name",
      "author": "",
      "browserslist": [
        "> 1%",
        "last 2 versions",
        "not ie <= 8"
      ],
      "bundleDependencies": false,
      "dependencies": {
        "vue": "^2.6.5",
        "vue-browser-detect-plugin": "^0.1.5",
        "vue-element-resize-event": "^0.1.0"
      },
      "deprecated": false,
      "description": "A Vue.js project",
      "devDependencies": {
        "postcss-import": "^11.0.0",
        "postcss-loader": "^2.1.6",
        "postcss-url": "^7.2.1"
      },
      "engines": {
        "node": ">= 6.0.0",
        "npm": ">= 3.0.0"
      },
      "license": "ISC",
      "main": "src/main.js",
      "name": "some_package",
      "private": false,
      "scripts": {
        "build": "node build/build.js",
        "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
        "start": "npm run dev"
      },
      "version": "1.0.8",
      "repository": {
        "type": "git",
        "url": "git+https://github.com/user/some_package.git"
      },
      "bugs": {
        "url": "https://github.com/user/some_package/issues"
      },
      "homepage": "https://github.com/user/some_package#readme"
    }
    
    

    This is the '.postcssrc.js' file of my package

    module.exports = {
      "plugins": {
        "postcss-import": {},
        "postcss-url": {},
        // to edit target browsers: use "browserslist" field in package.json
        "autoprefixer": {}
      }
    }
    
    • madflow
      madflow over 4 years
      What do you mean by "running" it. The postcss-import plugin is in your devDependencies. A npm install packagename does install these.