webpack
ADLF
每个不曾起舞的日子,都是对生命的辜负
展开
-
使用webpack+vue-cli构建项目
1、首先安装好node环境,然后再项目文件夹根目录下执行命令安装vue相关功能npm install -g @vue/cli-init2、初始化项目vue init webpack project(你新建的项目名称/文件名称)3、检验是否安装成功npm run dev...原创 2018-12-16 19:17:19 · 240 阅读 · 0 评论 -
webpack中babel的配置
配置文件,并排除node_modules目录在根目录中新建一个叫".babelrc"的Babel的配置文件,属于json格式,需要符合json语法规范,不能些注释配置config文件 ...翻译 2019-01-04 22:41:48 · 309 阅读 · 0 评论 -
使用vue实例的render方法渲染组件
一般渲染方法使用render函数渲染组件,替换指定的容器整个替换:如div id=app 会整个替换,上面的则不会翻译 2019-01-06 11:38:40 · 3871 阅读 · 0 评论 -
区分webpack中导入vue和普通网页使用script导入Vue的区别
如果是使用webpack的话先安装依赖 所以第一种修改方式: 第二种修改方式:翻译 2019-01-06 15:55:19 · 1514 阅读 · 2 评论 -
在vue中结合render函数渲染指定的组件到容器中
index.heml文件main.js文件结果: 如果使用runtime-only如何渲染组件呢?(上面是使用vue最全的方式渲染的,使用runtime-only会报错)先定义一个.vue组件,它分为三部分构成注意:一个template里面只能有一个根元素然后在main.js中导入组件,并安装相关loader在配置文件中新增load...翻译 2019-01-06 16:13:33 · 4006 阅读 · 1 评论 -
export default 和 export 的使用方式
在.vue中定义date msg1.导出一个对象,解析export default 是什么东西呢?(向外暴露对象)注意有两种方式导入和暴露,统一使用比较好第一种:第二种:注意使用这种方式,引入时候可以用任意变量来接收 只能这么接收 ...翻译 2019-01-06 16:31:34 · 7584 阅读 · 1 评论 -
结合webpack使用vue-router
使用路由控制,先安装goodlist是组件下一步添加上跳转链接实现翻译 2019-01-06 16:47:01 · 366 阅读 · 0 评论 -
结合webpack实现children子路由
翻译 2019-01-06 16:51:15 · 326 阅读 · 0 评论 -
组件中style标签lang属性和scoped属性的介绍
scoped只让样式渲染本组件,不会全局渲染翻译 2019-01-06 16:54:25 · 9502 阅读 · 0 评论 -
webpack中使用url-loader处理字体文件
使用bootstrap的图标main.js导入bootstrap配置文件中添加翻译 2019-01-04 22:13:06 · 2329 阅读 · 0 评论 -
webpack中网页背景图片url-loader的使用
安装配置规则有时候大的图片不希望设置base64编码,这时需要设置limit属性等于或者大于给定值就不进行编码如果不想让图片的名字变为哈希值 假如:引入相同名称的图片结果会出现两张一样的图片,因为后来者替换解决办法:名字前面加哈希值,最长32位。这里是8位。 ...翻译 2019-01-04 22:05:57 · 654 阅读 · 0 评论 -
loader-配置处理less文件的loader和scss文件的loader
安装在安装 配置webpack.config.js 处理scss安装再安装内部依赖配置新的loader翻译 2019-01-04 21:48:58 · 1255 阅读 · 0 评论 -
关于Webpack
翻译 2019-01-03 22:05:46 · 102 阅读 · 0 评论 -
Webpack的基本使用方式
新建一些文件夹main.js是我们的项目主入口文件所有文件再这里引入打包项目根目录初始化配置文件使用命令安装jquery导入jQuery包之后可以直接使用根目录运行通过webpack把main.js文件做了处理生产bundle.js文件存在dist目录下;之后在网页内引入打包好的文件 ...翻译 2019-01-03 22:27:13 · 197 阅读 · 0 评论 -
Webpack基本配置文件的使用
新建一个配置文件文件里使用node语法向外暴露一个对象翻译 2019-01-03 22:33:49 · 370 阅读 · 0 评论 -
Webpack-dev-server的基本使用
使用这个工具能够帮助我们保存就编译代码;本地安装webpack 配置下配置文件,就可以使用npm run dev来运行自动打开浏览器配置修改端口号设置默认打开的页面,热更新(少量更新刷新页面,实现浏览器无刷新重载) ...翻译 2019-01-03 23:10:23 · 1134 阅读 · 0 评论 -
webpack-dev-server配置命令的第2种方式
在webpack.config.js中配置,相对来说麻烦些;热更新第二步:导入webpack模块;第三步:配置插件节点;翻译 2019-01-03 23:15:41 · 803 阅读 · 0 评论 -
html-webpack-plugin插件的两个基本作用
内存里的页面在底部自动引入js翻译 2019-01-03 23:29:31 · 608 阅读 · 0 评论 -
loader-配置处理css样式表的第三方loader
在main.js文件中导入css翻译 2019-01-03 23:39:22 · 300 阅读 · 0 评论 -
loader-分析webpack调用第三方loader的过程
从右到左调用翻译 2019-01-04 21:41:48 · 307 阅读 · 0 评论 -
抽离路由模块
新建一个router.js文件导入组件创建对象main.js中导入路由翻译 2019-01-06 17:09:35 · 340 阅读 · 0 评论