有没有人有一个简单的教程在VueJs Webpack项目中捆绑和使用Modernizr?
我使用VueJS的默认Webpack项目和monofile组件。 我希望它全部捆绑在一起。
为了精确,我想在大多数表格中使用inputtypes.date,并避免在具有日期选择器支持的移动浏览器上显示vuetify日期选择器。
答案 0 :(得分:3)
我没有使用过modernizr,但根据我使用webpack的经验,我认为你可以使用现有的modernizr加载器,即webpack-modernizr-loader
正如其文档所说,您可以使用.modernizrrc.js
配置文件,例如:
"use strict";
module.exports = {
options: [
"setClasses"
],
"feature-detects": [
"inputtypes"
]
};
将webpack规则和别名添加到webpack.config.js
(请注意,您需要指向正确的位置,其中配置文件存储在alias path.resolve ...中):
const path = require('path');
module.exports = {
module: {
rules: [
{
loader: "webpack-modernizr-loader",
test: /\.modernizrrc\.js$/
}
]
},
resolve: {
alias: {
modernizr$: path.resolve(__dirname, "/path/to/.modernizrrc.js")
}
}
}
然后您可以导入modernizr
并像这样使用它:
import modernizr from 'modernizr';
if(modernizr.inputtypes.date) {
...
}