- 博客(17)
- 资源 (9)
- 收藏
- 关注
原创 webpack开发和生产两个环境的配置详解
目录webpack.base.conf.jswebpack.dev.conf.jswebpack.prod.conf.js一开始在接触webpack 的时候,简直痛不欲生,现在回头看,做个注释,当然参考了很多文章。这是一个关于vue 开发的webpack 架构会列举出来webpack 系列教程Webpack——令人困惑的地方Express结合Webpack的全栈自动刷新
2017-04-21 16:35:20 42565 4
原创 webpack的使用以及脱坑集合
使用process.argv 获取命令行使用的参数// 判断是否带production参数,production会压缩jsvar isprod = false;for (var i in process.argv) { if (process.argv[i] === "-p" || process.argv[i] === "--production") { ispr
2017-04-21 16:32:21 1484
原创 webpack入门(六)——html-webpack-plugin
html-webpack-plugin该插件可以简化创建调用webpack bundles的html文件。在每次编译后,文件名会包含有hash值的bundles 特别有用。你可以让插件为您生成一个HTML文件,也可以提供您自己使用lodash模板的模板,或使用您自己的装载机。 维护者:Jan Nicklas @jantimon。安装用npm安装这个插件$ npm i
2017-04-18 10:39:30 1456
原创 webpack入门(五)
resolveing一般问题的解决 1. –display-error-details 提供给你更多的出错信息。 2. 查问 配置文档关于 resolve 的部分。loader有它自己的 resolveing配置 resolveLoadernpm 链接的模块找不到它们的依赖。 node.js 模块的resolve步骤非常简单: 在模块的父文件夹中的node_modu
2017-04-18 10:38:16 481
原创 webpack入门(四)
什么是loaderloaders是你用在app源码上的转换元件。他们是用node.js运行的,把源文件作为参数,返回新的资源的函数。 例如,你可以用loaders告诉webpack加载 coffeeScript或者JSX。 loaders 特点: 1. 可以链式拼接。他们用在通向文件的管道,最后一个loader预期返回一个javascript,其它Loader可以返回任意格式给
2017-04-18 10:36:36 484
原创 webpack入门(三)
喂一个配置对象给webpack ,它就可以干活儿了。根据你用webpack的用法,有两种途径传入这个对象:CLI( 命令行)如果你用命令行,命令行会读取一个叫webpack.config.js(或者用 –config 选项传入的一个配置文件)的文件。这个文件应该导出一个配置对象,如下:module.exports = { // configuration};123
2017-04-18 10:35:16 554
原创 webpack入门(二)
安装可以用 npm 安装npm install webpack -g1注意: 这里全局安装是出于演示的目的。在真实的项目中,建议安装为你的项目依赖。开始首先,我们将只使用webpack的命令行界面学习基本webpack 。新建一个 模块化的javascript 项目cats.jsvar cats = ['dave', 'henry',
2017-04-18 10:34:03 611
原创 webpack入门(一)
如今的网站正在演化为web应用程序: 1. 越来越多的使用JavaScript。 2. 现代浏览器提供更广泛的接口。 3. 整页刷新的情况越来越少,甚至更多代码在同一个页面。(SPA)因此有很多代码在客户端! 一个体量庞大的代码库需要好好组织。模块系统提供代码库划分成模块的选项。模块系统风格目前有多个标准定义依赖和输出: 1. script标签(不要模块
2017-04-18 10:32:34 506
原创 webpack插件html-webpack-plugin详解
插件地址:https://www.npmjs.com/package/html-webpack-plugin这个插件用来简化创建服务于 webpack bundle 的 HTML 文件,尤其是对于在文件名中包含了 hash 值,而这个值在每次编译的时候都发生变化的情况。你既可以让这个插件来帮助你自动生成 HTML 文件,也可以使用 lodash 模板加载生成的 bundles,或者自己加载
2017-04-17 17:18:02 11439
原创 Vue.js中v-bind v-model的使用和区别
v-model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定,指的就是我们在js中的vue实例中的data与其渲染的dom元素上的内容保持一致,两者无论谁被改变,另一方也会相应的更新为相同的数据最基础的就是实现一个联动的效果 class="app"> Multiline message is: {{message}}
2017-04-17 14:12:07 15554 1
原创 Vue2.0如何改变定界符
在Vue2.0之后移除了Vue.config.delimiters的全局配置,提供新的API,我们可以在独立构建的时候使用它来改变默认的{{}},具体代码如下:上线申请 ${ childrens.name } var vm = new Vue( { el: '#app', data: { child
2017-04-17 13:56:53 3774
原创 解决webpack打包文件过大的问题
webpack 把我们所有的文件都打包成一个 JS 文件,这样即使你是小项目,打包后的文件也会非常大。下面就来讲下如何从多个方面进行优化。去除不必要的插件刚开始用 webpack 的时候,开发环境和生产环境用的是同一个 webpack 配置文件,导致生产环境打包的 JS 文件包含了一大堆没必要的插件,比如 HotModuleReplacementPlugin, NoErro
2017-04-12 18:01:49 4770
原创 webpack详细配置解析
阅读本文之前,先看下面这个webpack的配置文件,如果每一项你都懂,那本文能带给你的收获也许就比较有限,你可以快速浏览或直接跳过;如果你和十天前的我一样,对很多选项存在着疑惑,那花一段时间慢慢阅读本文,你的疑惑一定一个一个都会消失;如果你以前没怎么接触过Webpack,而你又你对webpack感兴趣,那么动手跟着本文中那个贯穿始终的例子写一次,写完以后你会发现你已明明白白的走进了Webpack的
2017-04-12 17:58:02 4645
原创 webpack部分配置解析
var webpack = require('webpack'); 2 var path = require("path"); 3 module.exports = { 4 // context: __dirname + "/src",//The base directory (absolute path!) 5 // 表示入口文件 6 cache: true,
2017-04-11 16:17:05 602
原创 Webpack对比其他框架的优势分析
代码拆分Webpack 有两种组织模块依赖的方式,同步和异步。异步依赖作为分割点,形成一个新的块。在优化了依赖树后,每一个异步区块都作为一个文件被打包。LoaderWebpack 本身只能处理原生的 JavaScript 模块,但是 loader 转换器可以将各种类型的资源转换成 JavaScript 模块。这样,任何资源都可以成为 Webpack 可以处理的模块。智能解析We
2017-04-11 09:17:17 3858
原创 ES6中export及export default、import的区别
相信很多人都使用过export、export default、import,然而它们到底有什么区别呢? 在JavaScript ES6中,export与export default均可用于导出常量、函数、文件、模块等,你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用,但在一个文件或模块中,export、import可以
2017-04-10 11:43:41 5810 1
原创 VueJs探索之watch用法详解
Vue.js 提供了一个方法 watch,它用于观察Vue实例上的数据变动。对应一个对象,键是观察表达式,值是对应回调。值也可以是方法名,或者是对象,包含选项。具体的用法可以直接看下面的示例,简单直接。 var vm = new Vue( { el: '#app', data: { childrens:
2017-04-07 16:10:53 102999 3
Sublime sftp插件本地上传配置文件
2017-11-27
移动端的大转盘抽奖
2017-11-27
【免费】SecureCRT8.1注册机 原版下载
2017-08-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人