Use with vuetify a la carte - No PostCSS Config found

[abelovic]

Do you want to request a feature or report a bug?

Question

What is the current behavior?

I'm trying to upgrade poi and getting errors when trying to use Vuetify a la carte:

https://vuetifyjs.com/en/guides/a-la-carte

and I get the following:

ERROR in ./node_modules/vuetify/src/stylus/components/_tabs.styl (./node_modules/css-loader??ref--6-1!./node_modules/postcss-loader/lib??ref--6-2!./node_modules/stylus-loader??ref--6-3!./node_modules/vuetify/src/stylus/components/_tabs.styl)
Module build failed: Error: No PostCSS Config found in: D:\dev\web-app\node_modules\vuetify\src\stylus\components
at D:\dev\web-app\node_modules\postcss-load-config\index.js:51:26
at
@ ./node_modules/vuetify/src/stylus/components/_tabs.styl 4:14-176 14:3-18:5 14:176-18:4 15:22-184
@ ./node_modules/vuetify/es5/components/VTabs/VTabs.js
@ ./node_modules/vuetify/es5/components/VTabs/index.js
@ ./src/index.js
@ multi ./node_modules/@poi/dev-utils/hotDevClient.js ./src/polyfills.js ./src/index.js

This is what I have in my .babelrc

["transform-imports", {
"vuetify": {
"transform": "vuetify/es5/components/${member}",
"preventFullImport": true
}
}]

How do I get this to work? According to the docs: https://github.com/egoist/poi/blob/master/docs/guides/using-css.md

PostCSS should work out of the box but this is looking for a a postcss.config inside the vuetify src :/

Please mention other relevant information such as the browser version, Node.js version, Poi version and Operating System.

node: 8.9.4
poi: 10.0.0.-rc-4
os: windows

[empz]

Same issue here.

[abelovic]

@egoist - your latest build fixed the previous issue (thanks!) but now I am getting:

vue.esm.js?a026:4750 Uncaught TypeError: Cannot read property 'install' of undefined
at Function.Vue.use (vue.esm.js?a026:4750)
at eval (index.js?b635:49)
at Object../src/index.js (main.js:1423)
at webpack_require (main.js:764)
at fn (main.js:142)
at Object.0 (main.js:1459)
at webpack_require (main.js:764)
at checkDeferredModules (main.js:44)
at main.js:825
at main.js:828

It doesn't look like its actually pulling in the files now :/ Errors on:

Vue.use(Vuetify, {
components: {
VApp,
.....
}
});

My .babelrc

{
"plugins": [
["transform-imports", {
"vuetify": {
"transform": "vuetify/es5/components/${member}",
"preventFullImport": true
}
}]
]
}

I removed the preset selection (it didn't like this):

"presets": [
["env", {"modules":false}],
["stage-2"]
],

This was taken from the vuetify sample here:

https://github.com/vuetifyjs/a-la-carte

[egoist]

@abelovic Try removing unnecessary dependencies, this is what I have:

"dependencies": {
  "vuetify": "^1.0.0"
},
"devDependencies": {
  "@babel/preset-env": "^7.0.0-beta.44",
  "@babel/preset-stage-2": "^7.0.0-beta.44",
  "babel-plugin-transform-imports": "^1.4.1",
  "cross-env": "^3.0.0",
  "stylus": "^0.54.5",
  "stylus-loader": "^3.0.1"
}

And the .babelrc:

{
  "presets": [
    ["@babel/preset-env",  {"modules": false}],
    ["@babel/preset-stage-2"]
  ],
  "plugins": [
    ["transform-imports", {
      "vuetify": {
        "transform": "vuetify/es5/components/${member}",
        "preventFullImport": true
      }
    }]
  ]
}

[abelovic]

@egoist - thanks! I stripped away everything I could and it works now. I must've had some conflicting dependencies somewhere :/

I think I am getting close. I am now having issues with graphql/loader (worked before) so I created another issue here: #410

Hopefully you have some ideas because I really don't want to use inline string literals ;)