Module build failed: Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-import'

[edouard-lopez]

Following the readme instruction I can't get it to work

Details

yarn add --dev postcss-loader

Module build failed: Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-import'

Error (Logs|Stacks)

ERROR in ./node_modules/css-loader!./node_modules/postcss-loader/lib?{"config":{"path":"config/postcss.config.js"}}!./node_modules/sass-loader/lib/loader.js!../src/pdui.scss
Module build failed: Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-import'
    at Function.Module._resolveFilename (module.js:527:15)
    at Function.Module._load (module.js:476:23)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)
    at load (/data/projects/peopledoc-ui/webpack-demo/node_modules/postcss-load-plugins/lib/plugins.js:44:18)
    at /data/projects/peopledoc-ui/webpack-demo/node_modules/postcss-load-plugins/lib/plugins.js:66:18
    at Array.forEach (<anonymous>)
    at plugins (/data/projects/peopledoc-ui/webpack-demo/node_modules/postcss-load-plugins/lib/plugins.js:65:8)
    at /data/projects/peopledoc-ui/webpack-demo/node_modules/postcss-load-config/index.js:64:18
    at <anonymous>
 @ ../src/pdui.scss 4:14-209 18:2-22:4 19:20-215
 @ ./src/index.js

Reproduction [Code]

webpack-demo/config/postcss.config.js

module.exports = {
  parser: 'sugarss',
  plugins: {
    'postcss-import': {},
    'postcss-cssnext': {},
    'cssnano': {}
  }
}

webpack.config.js

{
	test: /\.scss$/,
	use: [
		{loader: "style-loader"},
		{loader: "css-loader"},
		{
			loader: "postcss-loader",
			options: {config: {path: 'config/postcss.config.js'}}
		},
		{loader: "sass-loader"}
	]
}

Environment

---

Please provide information about your environment.

OS	node	npm	PostCSS
Linux Mint 18.2	v8.7.0	5.5.1	^2.0.8

[edouard-lopez]

Pluging are not in the core, you need to install them, for instance

yarn add --dev \
  postcss-loader \
  postcss-import \
  postcss-cssnext \
  cssnano \
  sugarss \
  autoprefixer

[t00768nh]

テンプレートイメージで写真アップすると大きくはみ出ますね
https://gyazo.com/1bfc1606b3feb9579395b776d52b0ad8

[qiuwww]

thank you

[perrywarner]

Quick Google Translate of what @t00768nh was saying:

Might be a valid point but @t00768nh didn't do his/her due diligence in defining whatever bug or providing steps to reproduce, resulting in irrelevant info.. doesn't look like that "gyazo.com" link is that vulnerable though, but step carefully..

[kobe-14]

@t00768nh thats because you would not have imported the image properly, I mean the path of the image was wrong

[aichiyudetuzhi]

thanks