项目名为webpack,直接报错,在package.json里面把名字修改
TypeError: this.getOptions is not a function版本过高,得安装低版本的
打包jquery报错,大概率是jQuery版本过低,不支持,或者有的包官网已经没有了,去官网看看最新的包并下载 npm i jquery@版本号 -S
webpack自动打包问题,打包后的路径没有在根目录的首页找到,访问报404,访问本机127.0.0.1/8080报Cannot GET /,暂时未找到解决方法,先不自动打包,手动吧,后续看看怎么解决
webpack自动打包报Cannot GET /问题,修改样式无法改变,目前解决的方法是版本号,把webpack安装成@4.29.0,webpack-cli版本号安装成3.2.1,jQuery安装成3.6.0,webpack-dev-server安装成3.1.14版本即可完美解决
安装完最新版本的html-webpack-plugin webpack 错误: TypeError: Cannot read property ' tap ' of undefined 1.错误原因
解决方法:安装html-webpack-plugin版本号为3.2.0
webpack中的加载器
打包处理css文件时报TypeError: this.getOptions is not a function错时
安装style-loader版本为0.23.1,css-loader版本为2.1.0
打包处理less文件时报TypeError: this.getOptions is not a function错时
安装less版本为3.9.0,less-loader版本为4.1.0
打包处理scss文件时报TypeError: this.getOptions is not a function错时
安装node-sass版本为10.2.0,安装sass-loader版本为4.14.1
安装 node-sass
出错了,Downloading binary from https://github.com/sass/node-sass/releases/download/v4.14.1/win32-x64-72_binding.node
出不了墙,用这个下载就行了npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
这一行命令可以解决这个错误
安装post-css自动添加css的兼容性前出错了报TypeError: this.getOptions is not a function错时
安装postcss-loader版本为4.3.0,autoprefixer版本为9.8.6
打包样式表中的图片以及字体文件
安装url-loader和file-loader后图片要是显示不出来
把url-loader版本号改为2.3.0即可,file-loader最新版本即可(要是报错可安装旧版本6.2.0)
打包js文件中的高级语法
安装babel转换器
npm install babel-loader @babel/core @babel/runtime -D
安装babel语法插件包
npm install @babel/preset-env @babel/plugin-transform-runtime @babel/plugin-proposal-class-properties -D没有报错(要是运行不起来,可往下去图片根据版本号依次安装对应的版本)
配置vue的加载器
安装vue组件的加载器 npm install vue-loader vue-template-compiler -D(安装最新版本即可,没有报错,有报错改为下面代码块的版本)
.vue文件的加载器
安装vue组件的加载器 npm install vue-loader vue-template-compiler -D(一般不会报错,出错还是按照文底的代码块版本重新安装)
这是安装的所有包的版本号
"dependencies": {
"jquery": "^3.6.0",
"node-sass": "^4.14.1",
"sass-loader": "^10.2.0",
"vue": "^2.6.14"
},
"devDependencies": {
"@babel/core": "^7.16.0",
"@babel/plugin-proposal-class-properties": "^7.16.0",
"@babel/plugin-transform-runtime": "^7.16.4",
"@babel/preset-env": "^7.16.4",
"@babel/runtime": "^7.16.3",
"autoprefixer": "^9.8.6",
"babel-loader": "^8.2.3",
"css-loader": "^2.1.0",
"file-loader": "^6.2.0",
"html-webpack-plugin": "^3.2.0",
"less": "^3.9.0",
"less-loader": "^4.1.0",
"postcss-loader": "^4.3.0",
"style-loader": "^0.23.1",
"url-loader": "^2.3.0",
"vue-loader": "^15.9.8",
"vue-template-compiler": "^2.6.14",
"webpack": "^4.29.0",
"webpack-cli": "^3.2.1",
"webpack-dev-server": "^3.1.14"
}