Webpack,web:网络,pack:打包
webpack.wuhaolin.cn是一个介绍webpack的网站,这个网站的优势是每节内容都有对应的源码,内容也容易理解,学习成本低,第1章是大致给你介绍一下webpack,后面内容是具体细化
学习这个网站的webpack内容时,先翻到每节底部,如果有源码,先下载源码,然后看这节的内容,最后安装需要的npm包,记住,我们的包的版本要跟网站上提供的源码里的版本一致,否则可能会报错
webpack报错原因主要是版本不兼容
webpack3.8.1在遇到css-loader?minimize会报错,需要去掉?minimize;而webpack3.4.0不会报错
extract-text-webpack-plugin,这个插件在webpack4中不支持
如果你用的是webstorm进行开发,要在项目里安装node_modules了,要给node_modules的外面一层文件夹右键--》Mark Directory As--》Excluded,如果不做这一步的话,电脑会卡死
安装webpack-dev-server以后,即使是全局安装,仍然不能使用webpack-dev-server命令,会报错:“The CLI moved into a separate package: webpack-cli Please install 'webpack-cli' in addition to webpack itself to use the CLI -> When using npm: npm i -D webpack-cli”,就按照报错信息来,运行npm i -D webpack-cli来安装webpack-cli,但是推荐用cnpm,因为速度更快,但是安装以后再运行‘webpack-dev-server’,报了另外一个错误:“throw new Error('invalid "instanceof" keyword value ' + c)”,最后我下载了1.6节页面最底部的源码,删除node_modules,用网站的源码,然后cnpm install以后,就正常运行了
1.6节说让你执行‘webpack-dev-server’,你不要直接在cmd命令行上执行‘webpack-dev-server’,要要把命令行放在package.json的
"scripts": {
"build": "webpack-dev-server --hot --devtool source-map"
}里,运行cnpm run build
构建完毕以后,出现的.map后缀名的文件,就是sourcemap文件
entry: ['./main.js', './branch.js'],entry如果是一个数组,里面有2个js,就会从左往右执行
安装node-sass以后,不能直接执行‘node-sass main.scss main.css’,要把‘node-sass main.scss main.css’放在npm script里(比如"node-sass" : "node-sass main.scss main.css"),再执行‘cnpm run node-sass’就可以了
问:怎么记忆css-loader/style-loader呢?
答:css-loader的核心是css,也就是处理css代码的;style-loader的核心是style,是把css插入到