开发者学堂课程【微服务+全栈在线教育实战项目演练(SpringCloud Alibaba+SpringBoot):前端技术—webpack 打包 js 文件(2)】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/667/detail/11326
前端技术—webpack 打包 js 文件(2)
内容简介
一、使用命令执行打包操作
二、最终测试
一、使用命令执行打包操作
Webpack#有黄色警告
Webpack--mode=development#没有警告
这项操作目的是将打包的文件放到dust中,最后的名字为 bundle.js。
将 webbackdemo 用终端打开,直接输入命令 webpack,在安装插件后回车打包完成。
在最后部分出现的警告不影响结果,所有的结果都在一行显示出来,此时已经被压缩成功了。
观察出现的警告,翻译后的意思是模式选项没有被设置,现在需要设置模式选项是开发或是生产环境。
二、最终测试
1.测试方式
创建 html 文件,引入打包之后 js 文件,使用浏览器查看效果。
在 webpackdemo 中建立01.html 文件,
输入《script src=”dist/bundle.js></script> ,这一步是执行打包后的文件,检测是否可以调用。
右键选择用浏览器打开后,输出的内容为 hello common3,这一值就是上节中提到的1adda2的值。