@srejs/vue-webpack
Version:
srejs vue技术栈webpack配置工具包
165 lines (163 loc) • 6.64 kB
JavaScript
;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.possLoader = exports.loaderRules = void 0;
var MiniCssExtractPlugin = _interopRequireWildcard(require("mini-css-extract-plugin"), true);
var _common = require("@srejs/common");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
var possLoader = exports.possLoader = {
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: [require('autoprefixer')({
overrideBrowserslist: ['last 2 versions']
}), !_common.isDev() ? require('cssnano') : null]
}
}
};
var sassLoader = {
loader: 'sass-loader',
options: {
// Prefer `dart-sass`
implementation: require('sass')
}
};
var getCssLoader = function getCssLoader() {
return {
loader: 'css-loader',
options: {
url: true,
modules: {
localIdentName: '[local]_[hash:base64:5]',
auto: /\.module\.\w+$/i //https://github.com/webpack-contrib/css-loader#auto 通过文件格式来区分开启cssmodule 默认第三方组件库就不要使用css module
}
}
};
};
var getCssModuleLoader = function getCssModuleLoader() {
return {
loader: 'css-loader',
options: {
modules: {
localIdentName: '[local]_[hash:base64:5]'
}
}
};
};
/**
* 开发模式采用vue-style-loader 以开启css热加载
* 生产模式mini-css-extract-plugin提取css为单独文件
* @returns
*/
var getCommonLoader = function getCommonLoader() {
var commonDevLoader = ['vue-style-loader'];
var commonProdLoader = [MiniCssExtractPlugin.loader];
return _common.isDev() ? commonDevLoader : commonProdLoader;
};
var loaderRules = exports.loaderRules = function loaderRules() {
var isServer = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var cssLoader = getCssLoader();
var cssModuleLoader = getCssModuleLoader();
var commonLoader = getCommonLoader();
var envOptions = {
modules: false
};
if (!isServer) {
Object.assign(envOptions, {
corejs: {
version: 3.8,
proposals: true
},
useBuiltIns: 'usage'
});
}
return [{
test: /\.vue$/,
loader: 'vue-loader',
options: {
compilerOptions: {
preserveWhitespace: false
},
extractCSS: true,
cssModules: {
localIdentName: '[path][name]---[local]---[hash:base64:5]',
camelCase: true
}
}
}, {
test: /\.(js|jsx|mjs|ts|tsx)$/,
use: {
loader: 'babel-loader',
options: {
cacheDirectory: true,
cacheCompression: false,
presets: [['@babel/preset-env', envOptions], '@babel/preset-typescript'],
plugins: [['@babel/plugin-transform-runtime', {
helpers: false,
regenerator: true
}]]
}
},
exclude: /node_modules/
}, {
test: /\.css$/,
oneOf: [{
resourceQuery: /module/,
use: [].concat(_toConsumableArray(commonLoader), [cssModuleLoader, possLoader])
}, {
use: [].concat(_toConsumableArray(commonLoader), [cssLoader, possLoader])
}]
}, {
test: /\.styl(us)?$/,
oneOf: [{
resourceQuery: /module/,
use: [].concat(_toConsumableArray(commonLoader), [cssModuleLoader, possLoader, 'stylus-loader'])
}, {
use: [].concat(_toConsumableArray(commonLoader), [cssLoader, possLoader, 'stylus-loader'])
}]
}, {
test: /\.scss$/,
oneOf: [{
resourceQuery: /module/,
use: [].concat(_toConsumableArray(commonLoader), [cssModuleLoader, possLoader, sassLoader])
}, {
use: [].concat(_toConsumableArray(commonLoader), [cssLoader, possLoader, sassLoader])
}]
}, {
test: /\.less$/,
oneOf: [{
resourceQuery: /module/,
use: [].concat(_toConsumableArray(commonLoader), [cssModuleLoader, possLoader, 'less-loader'])
}, {
use: [].concat(_toConsumableArray(commonLoader), [cssLoader, possLoader, 'less-loader'])
}]
}, {
test: /\.(png|jpg|jpeg|gif|svg)$/,
use: [{
loader: 'url-loader',
options: {
name: '[contenthash:8].[name].[ext]',
limit: 8192,
outputPath: 'images/'
}
}]
}, {
test: /\.(eot|woff|woff2|ttf)(\?.*)?$/,
use: [{
loader: 'url-loader',
options: {
name: '[contenthash:8].[name].[ext]',
outputPath: 'fonts/'
}
}]
}];
};