1 | const fs = require('fs')
|
2 | const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
3 | // 文件或目录是否存在
|
4 | const exists = exports.exists = function (path) {
|
5 | return fs.existsSync(path)
|
6 | }
|
7 |
|
8 | // 是否是文件
|
9 | exports.isFile = function (path) {
|
10 | return exists(path) && fs.statSync(path).isFile()
|
11 | }
|
12 |
|
13 | // 是否是目录
|
14 | exports.isDir = function (path) {
|
15 | return exists(path) && fs.statSync(path).isDirectory()
|
16 | }
|
17 |
|
18 | exports.stlyeRules = function stlyeRules (sourceMap, extract, userConfig) {
|
19 | const types = [
|
20 | { test: /\.css$/, loader: 'css' },
|
21 | { test: /\.styl$/, loader: 'stylus' },
|
22 | { test: /\.less/, loader: 'less' },
|
23 | { test: /\.s[ac]ss$/, loader: 'sass' }]
|
24 | const options = { sourceMap: !!sourceMap }
|
25 | const use = [
|
26 | {
|
27 | loader: MiniCssExtractPlugin.loader,
|
28 | options: {}
|
29 | },
|
30 | {
|
31 | loader: 'css-loader',
|
32 | options: options
|
33 | },
|
34 | {
|
35 | loader: 'postcss-loader'
|
36 | }
|
37 | ]
|
38 | if (userConfig.device && userConfig.device === 'mobile') {
|
39 | use.push({
|
40 | loader: 'px2rem-loader',
|
41 | options: {
|
42 | remPrecision: 2
|
43 | }
|
44 | })
|
45 | }
|
46 |
|
47 | if (!extract) {
|
48 | use.unshift({
|
49 | loader: 'style-loader',
|
50 | options: options
|
51 | })
|
52 | }
|
53 |
|
54 | return types.map((t) => {
|
55 | const tuse = t.loader === 'css' ? use : use.concat({
|
56 | loader: t.loader + '-loader',
|
57 | options: options
|
58 | })
|
59 |
|
60 | return extract ? {
|
61 | test: t.test,
|
62 | use: tuse
|
63 | } : {
|
64 | test: t.test,
|
65 | use: tuse
|
66 | }
|
67 | })
|
68 | }
|
69 |
|
70 | // exports.extractVueStlye = function extractVueStlye () {
|
71 | // return {
|
72 | // css: {
|
73 | // use: [MiniCssExtractPlugin.loader, 'css-loader',{
|
74 | // loader: 'px2rem-loader',
|
75 | // options: {
|
76 | // remPrecision: 2
|
77 | // }
|
78 | // }],
|
79 | // fallback: 'vue-style-loader'
|
80 | // },
|
81 | // stylus: {
|
82 | // fallback: "vue-style-loader",
|
83 | // use: [MiniCssExtractPlugin.loader, 'css-loader', 'stylus-loader', {
|
84 | // loader: 'px2rem-loader',
|
85 | // options: {
|
86 | // remPrecision: 2
|
87 | // }
|
88 | // }]
|
89 | // },
|
90 | // less: {
|
91 | // fallback: "vue-style-loader",
|
92 | // use: [MiniCssExtractPlugin.loader, 'css-loader', 'less-loader', {
|
93 | // loader: 'px2rem-loader',
|
94 | // options: {
|
95 | // remPrecision: 2
|
96 | // }
|
97 | // }]
|
98 | // },
|
99 | // sass: {
|
100 | // fallback: "vue-style-loader",
|
101 | // use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader', {
|
102 | // loader: 'px2rem-loader',
|
103 | // options: {
|
104 | // remPrecision: 2
|
105 | // }
|
106 | // }]
|
107 | // },
|
108 | // scss: {
|
109 | // fallback: "vue-style-loader",
|
110 | // use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader', {
|
111 | // loader: 'px2rem-loader',
|
112 | // options: {
|
113 | // remPrecision: 2
|
114 | // }
|
115 | // }]
|
116 | // }
|
117 | // }
|
118 | // }
|