首页 > 代码库 > vue-loader 配置了css加载器属性。
vue-loader 配置了css加载器属性。
module: { loaders: [ // 这里也是相应的配置,test就是匹配文件,loader是加载器, { test: /\.vue$/, loader: ‘vue‘ }, { test: /\.js$/, loader: ‘babel‘, include: projectRoot, exclude: /node_modules/ }, { test: /\.json$/, loader: ‘json‘ }, /* { test: /\.css$/, //这是注释掉的模块,一开始很疑惑加入css的编译模块马上就报错了,注释掉之后sass代码照样可以成功编译。 loader: ["vue-style-loader", "css-loader"] }, { test: /\.less$/, loader: ["vue-style-loader", "css-loader", "less-loader"] }, { test: /\.(scss|sass)$/, loader: ["node-sass", "vue-style-loader", "css-loader", "sass-loader"] }, { test: /\.scss/, loaders: [‘css‘, ‘autoprefixer‘, ‘sass‘], },*/ { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: ‘url‘, query: { limit: 10000, name: utils.assetsPath(‘img/[name].[hash:7].[ext]‘) } }, { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: ‘url‘, query: { limit: 10000, name: utils.assetsPath(‘fonts/[name].[hash:7].[ext]‘) } } ] }, // vue-loader 配置 vue: { //后面才清楚是// vue-loader 中已经配置了 loaders: utils.cssLoaders({ sourceMap: useCssSourceMap }), //加载css配置模块 // Autoprefixer是一个基于PostCSS的智能添加CSS前缀的插件 postcss: [ require(‘autoprefixer‘)({ browsers: [‘last 2 versions‘] //意思是只对主流浏览器的最新两个版本(其实也就是不做兼容了,现代最新的浏览器基本都不需要兼容了呀) }) ] } }
- 配置静态资源路径
- 生成cssLoaders用于加载.vue文件中的样式
- 生成styleLoaders用于加载不在.vue文件中的单独存在的样式文件
vue-loader则只配置了css加载器以及编译css之后自动添加前缀。(所以才可以直接编译.vue文件里面的sass样式)
vue-loader 配置了css加载器属性。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。