# webpack 中打包 css、less、sass 文件的坑

vscode 用 import 语法引入 css 文件不显示 css 路径:安装一个路径显示插件即可,推荐使用 Path Autocomplete 即可解决

原本安装好 css-loader 准备用 webpack 打包 css 文件时出现一堆底层报错说 TypeError: this.getOptions is not a function

ERROR in ./src/css/index.css
Module build failed (from ./node_modules/style-loader/dist/cjs.js):
TypeError: this.getOptions is not a function
    at Object.loader (C:\Users\12071\Desktop\练习\webpack-test\node_modules\style-loader\dist\index.js:19:24)
 @ ./src/js/app.js 8:0-25

原因:loader 版本不匹配

解决方案:安装配套版本的 style-loadercss-loader

//安装2.0版本的style-loader
npm i style-loader@2.0.0
//安装5.2.7版本的css-loader
npm i css-loader@5.2.7

stackoverflow YYDS

less 文件无法打包

原因:less-loader 版本过高

解决方案:安装低于 5.0 版本的 less-loader

npm install less-loader@5.0 -D

stackoverflow YYDS