-
小伙伴们,大家好,针对老师的视频教程,我整理了一份完整的源码,源码还有详细的注释和笔记,供大家学习时参考。
GitHub下载地址:https://github.com/Jasonccj/vue-webpack-todo
查看全部 -
为什么要把第三方类库和业务逻辑代码分离打包?
如果把业务逻辑代码和第三类库打包到一起,整个类库代码就需要随着业务代码的更新而更新,这样类库代码就不能在浏览器里进行缓存。为了尽可能的使用浏览器缓存来减少服务器流量,以及用户加载速度更快,所以单独拆分出来进行打包
查看全部 -
hash 指所有的js文件都是一个hash值
chunkhash 指从js中分离出来的类库与js业务逻辑代码的hash不同
为什么要分离出来呢?高效的利用浏览器缓存,如果不分离每次修改业务逻辑代码导致js类库也会更新一次,效率低
查看全部 -
dev server配置讲的很赞,webpack4中设置devserver之后不走output,dist保存在内存中,想生成的话切回生产环境
查看全部 -
starterkit,best查看全部
-
数据在哪声明就在哪操作数据,一般都在顶层操作查看全部
-
vue工程的搭建
npm init
1、npm i webpack vue vue-loader
2、npm i css-loader vue-template-compiler
3、新建src目录并在src下新建app.vue
4、在app.vue中编写vue组件
5、在根目录下新建webpack.config.js
查看全部 -
数据声明要放在顶层vue中查看全部
-
环境优化:
webpack 配置下面
target 设置webpack运行环境
安装 corss-env (避免了不同版本设置的不童命令)
pack.jon
添加scrpts中对应的参数
build : "corss-env NODE_ENV=production(自己起个名) webpack --config webpack.config.js "
dev "orss-env NODE_ENV=development自己起个名) webpack --config webpack.config.js"
定好变量判断开发环境
下面执行环境中的一些设定
值为 localhost 内网和本机
0.0.0.0 优势,本机、内网 、ip、手机
定义通用的环境变量,让webpack区别执行开发得到更多信息,生产环境更快
查看全部 -
css预处理器
loader 处理图片
css loader处理器
查看全部 -
利用loader将小图片变成js代码
重新定义文件内容
查看全部 -
hot=true可以实现局部刷新查看全部
-
html-web-plugin查看全部
-
小伙伴们,大家好,针对老师的视频教程,我整理了一份完整的源码,源码还有详细的注释和笔记,供大家学习时参考。
GitHub下载地址:https://github.com/Jasonccj/vue-webpack-todo
查看全部 -
1. 项目初始化 npm init,创建package.json 2. 安装vue,vue-loader查看全部
举报