Transform some output css file by directory
Justinidlerz opened this issue · comments
Do you want to request a feature or report a bug?
feature: Transform some output css files by directory
What is the current behavior?
I have a small project, it include mobile client and desktop client.
I using vue-cli
v3.0.1 generate it, and config multiple pages.
I want to share some feature components to multiple client, only style different.
So make the project directory tree look like:
----- public
|--- index.html // desktop page
|--- mobile.html // mobile page
----- src
|--- components // feature components
|--- mobile // mobile client entry and style
|--- App.vue
|--- main.ts
|--- desktop // desktop client entry and style
|--- App.vue
|--- main.ts
I want to use px2rem
plugin to transform css
file while it under the mobile
directory.
This is my vue-config
file:
module.exports = {
pages: {
index: 'src/pc/main.ts',
mobile: 'src/mobile/main.ts',
},
configureWebpack: {
devServer: {
disableHostCheck: true
},
module: {
rules: [{
test: /mobile\/.+\.css$/,
use: [
'vue-style-loader',
{
loader: 'postcss-loader',
options: {
plugins: [
px2rem({
remUnit: 75,
}),
],
},
},
],
}],
},
},
};
What is the expected behavior?
The css px
transform to rem
while it under the mobile directory.
Please mention other relevant information such as your webpack version, Node.js version and Operating System.
- vue-cli: 3.0.1
- node.js: 8.11.3