如何配置gulp，使其能够使用Angular2查找jquery“名称” - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

Angular2 初体验

准备开发环境 Angular2 通过 npm 发布，因此推荐使用 node/npm 环境，要开始使用 Angular2 ，先准备一个目录 learning-angular ，在这个目录中初始化项目...npm install 使用 es5 开发 Angular2 应用 Angular2 是个客户端框架，在浏览器中运行，因此使用 Javascript (es5) 来做开发也是完全可行的。...使用 TypeScript 开发 Angular2 应用虽然完全能够使用 Javascript es5 来开发，但是这并不是官方推荐的做法，官方推荐的是 TypeScript ，默认的教程也都是使用...安装完需要的包之后，我们需要一个 TypeScript 的配置文件 tsconfig.json 来配置 TypeScript 的编译，这个文件的代码如下： { "compilerOptions"...('ts:app'); }); }); 打开命令窗口，输入： gulp dev 然后可以开始愉快的使用 TypeScript 编写 Angular2 应用了。

2.7K2 0

干货 | 前端阶段性总结之「框架相关」那些事

不只是Angular1到Angular2的重新设计，甚至是Angular2自身的更新也不全兼容。但不得不说，虽然对用户不是非常友好，其实仔细品味的话，Angular有很多很棒的理念和设计的。...Angular1的个人演进入门+理解Directive/Controller/Provider/依赖注入等使用Yaomen自动化搭建Gulp+Grunt开发升级Angular(1.2到1.5) 改用...这也是一个比较有意思的概念吧，大家可以参考《深度剖析：如何实现一个 Virtual DOM 算法》。...数据绑定 Angular1：脏检测（$watch + $digest机制），性能比较难看 React：虚拟DOM，性能棒棒哒，但相比Vue的话，需要手动配置才能到最好效果 Vue1：getter/setter...03 结束语其实如今前端的框架/库/工具都不断地更新和迭代，像当初jQuery也是个很棒的库呢，到现在本骚年还是认为其中的设计很棒，大家感兴趣也可以看看《jQuery源码分析系列》。

1.4K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

gulp+webpack工具整合简介

Webpack 使用异步 I/O 和多级缓存提高运行效率，这使得 Webpack 能够以令人难以置信的速度快速增量编译。...gulp 简介 gulp是前端开发过程中对代码进行构建的工具，是自动化项目的构建利器；她不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；使用它，我们不仅可以很愉快的编写代码...通过本文，我们将学习如何使用Gulp来改变开发流程，从而使开发更加快速高效。...']); //定义默认任务 elseTask为其他任务，该示例没有定义elseTask任务 //gulp.task(name[, deps], fn) 定义任务 name：任务名称 deps：依赖任务名称...webpack插件配置 webpack内部全局变量： new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', template

1.8K8 0

gulp+webpack工具整合简介

Webpack 使用异步 I/O 和多级缓存提高运行效率，这使得 Webpack 能够以令人难以置信的速度快速增量编译。...gulp 简介 gulp是前端开发过程中对代码进行构建的工具，是自动化项目的构建利器；她不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；使用它，我们不仅可以很愉快的编写代码...通过本文，我们将学习如何使用Gulp来改变开发流程，从而使开发更加快速高效。...']); //定义默认任务 elseTask为其他任务，该示例没有定义elseTask任务 //gulp.task(name[, deps], fn) 定义任务 name：任务名称 deps：依赖任务名称...webpack插件配置 webpack内部全局变量： new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', template

2.8K5 0

正确的Webpack配置姿势，快速启动各式框架！

其实Webpack不应该拿来跟Grunt/Gulp比较的，但在本骚年这边它就是承担起了很大一部分工作。...能够对资源使用流水线(pipeline)。loader链式地按照先后顺序进行编译，从后往前，最终需要返回javascript。...不同的应用场景需要不同的loader，这里我简单介绍几个（loader使用前都需要安装，请自行查找依赖安装）： 1. babel-loader 官网在此，想要了解的也可以参考Babel 入门教程。...像我们常用的jQuery： 1234 new webpack.ProvidePlugin({jQuery: 'jquery',$: 'jquery'}) 4..../shared/something';// 配置后import {something} from 'shared/something'; 开发工具(devtool) 此选项控制是否生成，以及如何生成source

2.1K3 0

在 ASP.NET Core 项目中使用 npm 管理你的前端组件包

2、使用 npm 安装包　　这篇文章的示例项目，我采用的是 ASP.NET Core 2.2 默认生成的 MVC 项目，因为在写文章的过程中有过更换解决方案，所以文章中的截图可能会出现名称前后不对应的情况...右击我们的项目，添加一个 package.json 配置文件。在这个 json 文件中定义了这个项目所需要的各种前端模块，以及项目的配置信息（比如名称、版本、许可证等等）。...当我们安装 jquery 的 1.9.1 版本后，因为之前的 jquery 版本存在一些安全隐患，所以 npm 会提示我们执行 npm audit 命令来查看当前项目中可能存在的安全隐患，以及对于如何解决这些隐患的建议...3、gulp 配置当我们通过 npm 添加好需要使用的组件包后，就需要考虑如何在项目中使用。　　...三、总结　　这一章主要是介绍了如何在我们的 ASP.NET Core 项目中通过 npm 管理我们的前端组件包，同时，使用 gulp 去执行一些移动文件、压缩文件的任务。

2.5K3 0

2017年前端开发手册一-2016前端技术回顾

很多人放弃Gulp选择NPM scripts,但Gulp仍然很受欢迎。 7. SASS仍然是一个受欢迎的工具,而PostCSS(+ CSSNext)也在不断前进。 8....10. jQuery还在,但人们使用的兴趣下降了。jQuery 3的上线,就像森林中的一棵树倒下,没有人听到。 11. Vue.js继续得到支持。理应如此! 12....随着网络技术越来越重要，能够使用一些像NW.js和Electron的技术开发windows，OSX和linux本地应用程序。 16....Angular2(又名“Angular”)从神坛上走了下来，开发者也意识到它永远不会像Angular 1那样主流。 17. JavaScript明显仍然是软件技术的中心。 18....26．和不一致的浏览器API作斗争的日子已经过去了，是由于旧版本IE的使用发展都已经大幅下降。 27．大多数人都意识到他们在web开发上必须有一个多设备战略计划。 28.

1.6K5 0

Web开发在过去20多年时间里如何改变了我

2007年年底，我开始使用C#编写ASP.NET。HTML和JavaScript仍然参与其中，但多多少少被封装在第三方控件中，并且jQuery当时是JavaScript的别名。...JavaScript的一切都是jQuery。ASP.NET WebForms感觉巨大又不是很灵活，但它能有效工作。...（好吧，我们确实在2005年搞回了一个很酷的SPA，但我们没有想过如何用它创建一个框架。） NodeJS通过在服务器上使用JavaScript再次改变了世界。...之后，在过去几年时间里我开始使用AngularJS。Angular2是应该好好研究TypeScript的一个原因，因为现在的Angular2完全是用TypeScript写的。...我可以启动另一个控制台来使用如NPM、gulp、typings、dotnet CLI、NodeJS等工具；以及启动我最喜欢的轻量级编辑器来编写代码！

2.1K6 0

Hexo博客静态资源加速

加速文件参考了Gulp压缩的基本方案 Butterfly主题文档-Gulp压缩参考了gulp的优化方案卓越科技-如何优化博客参考了Jsdelivr的刷新方案二兔-解决jsdelivr缓存问题的几个办法...Gulp压缩全站静态资源 gulp能够帮助用户自动压缩静态资源，配合各类下属插件，能够压缩包括css、js、html乃至各类格式的图片文件。...此处举例，假设使用gulp压缩后，位于/source/js/example.js无法正常使用。...实际上就是使用@import引入自定义样式。以下内容在Hexo异步加载方案中亦有提及。将魔改样式整合到index.css文件内，减少对服务器的请求次数。能够节省大量加载时间。...（如果是手动添加整合的话，只能用注释分割，显然很不利于后续查找修改），而在每次提交时，运行hexo g的过程中就会将所有CSS文件都整合到index.css,可以在主题配置文件的CDN配置项里给index.css

3.3K4 0

2018 最值得关注的前端技术

说到parcel的最大优势，貌似就是webpack的最大劣势：配置和性能！parcel号称零配置，多核打包，并且使用文件缓存，在时间上比webpack快了将近10倍！ ?...这意味着浏览器端的性能会得到极大提升，它也使得我们能够实现一个底层构建模块的集合，例如，强类型和块级作用域。...在2017的调查报告里面可以看到，趋势基本上是react已经占据主流，不使用框架位居第二，angular1，angular2分列三四。 ? 中国的情况就是，react第一，vue第二 ?...18年，angular还是会和react和vue齐名的三大框架，只是使用者不如react和vue那样多。 jquery jquery在2018年也不会没落，只是使用率还是会进一步的减少。...说到jquery，还真是一个时代的转变，在我刚接触前端的时候，jquery打天下。那个时候相对于其他的库和框架，jquery就是一个巨无霸，使用率遥遥领先。

1.5K3 1

2018前端最值得关注的技术有哪些？

说到parcel的最大优势，貌似就是webpack的最大劣势：配置和性能！parcel号称零配置，多核打包，并且使用文件缓存，在时间上比webpack快了将近10倍！...这意味着浏览器端的性能会得到极大提升，它也使得我们能够实现一个底层构建模块的集合，例如，强类型和块级作用域。...在2017的调查报告里面可以看到，趋势基本上是react已经占据主流，不使用框架位居第二，angular1，angular2分列三四。...18年，angular还是会和react和vue齐名的三大框架，只是使用者不如react和vue那样多。 jquery jquery在2018年也不会没落，只是使用率还是会进一步的减少。...说到jquery，还真是一个时代的转变，在我刚接触前端的时候，jquery打天下。那个时候相对于其他的库和框架，jquery就是一个巨无霸，使用率遥遥领先。

1.4K2 0

Python全栈之jQuery笔记

jQuery版本: 1.x版本: 能够兼容IE678浏览器 2.x版本: 不兼容IE678浏览器 1.x和2.x版本的jQuery都不再更新版本了,现在只更新3.x版本....通过jQuery,您能够向下遍历DOM树,以查找元素的后代....grunt、gulp grunt和gulp是使用node.js编写的,前端首选的自动化工具,gulp在书写配置上比grunt更简洁,运行的性能更高,gulp逐渐成为主流....gulp的使用 gulp使用步骤: 安装nodejs->全局安装gulp->项目安装gulp以及gulp插件->配置gulpfile.js->运行任务 gulp网站:http://gulpjs.com...js 3、JS放到页面底部引入 4、避免全局查找 5、减少属性查找 6、使用原生方法 7、用switch语句代替复杂的if else语句 8、减少语句数,

6.7K4 0

基于 gulp 的 fancybox 源码压缩

细心的童鞋可能发现了，fancybox 默认使用的 js 文件是jquery.fancybox.min.js，相比源码文件jquery.fancybox.js 多了一个 min 后缀！...接下来，我们以 fancybox 的源码的为例，简单了解一下 Gulp 的安装和使用。...Gulp 安装与使用首先，gulp 是基于 node.js 的工具，所以，在安装 Gulp 前我们需要先安装 node.js 和 npm。...对于已经存在package.json配置文件(定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）)的目录，我们可以直接在当前目录执行npm install进行安装，npm...install命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。

1.5K1 0

前端构建系统-《node.js实战》

4.2 配置前端构建工具 — 在使用npm脚本时，通常有三种配置前端构建前端工具的方法。指定命令行参数：....下面举个例子，用gulp.src查找jsx文件，用babel处理ES2015和React，然后把文件拼到一起。...{ // 首先是用文件聚集找到所有的输入文件 // 用Gulp自带的工具gulp.src查找所有的react jsx文件 return gulp.src('app/*.jsx')...npm包,例子： - 安装：npm i --save-dev jquery - 引用 const jquery = require('jquery'); yes，正如你看到的，Webpack把CommonJS...模块给了我们，无需任何额外的配置，就可以使用来自npm的模块。。

2.3K2 0

基于 gulp 的 fancybox 源码压缩

细心的童鞋可能发现了，fancybox 默认使用的 js 文件是 jquery.fancybox.min.js ，相比源码文件 jquery.fancybox.js 多了一个 min 后缀！...Gulp 安装与使用首先，gulp 是基于 node.js 的工具，所以，在安装 Gulp 前我们需要先安装 node.js 和 npm。...对于已经存在 package.json 配置文件(定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）)的目录，我们可以直接在当前目录执行 npm install 进行安装...， npm install 命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。...使用Gulp构建网站小白教程》，十年踪迹的博客 bibichuan，《fancybox3使用总结》，bibichuan 的底盘 - Github 个人博客

1.7K3 0

gulp 详解与使用

为什么要用 gulp 与 grunt 相比，gulp 无需写一大堆繁杂的配置参数，API（中文 API）也非常简单，学习起来很容易，而且 gulp 使用的是 nodejs 中 stream 来读取和操作数据...如何使用 gulp Installing Gulp 新版的 gulp 命令行工具已经改名为 gulp-cli 。如果你之前安装了全局的 gulp 。...dist/foo.js/jquery.js ，而不是 dist/foo.js 要想改变文件名，可以使用插件 gulp-rename 下面说说生成的文件路径与我们给 gulp.dest() 方法传入的路径参数之间的关系...("build")); //配置了base参数，此时base路径为script //假设匹配到的文件为script/lib/jquery.js //此时生成的文件路径为build/lib/jquery.js...2、gulp 中着重了解 gulp.task() 如何处理依赖任务是耗时操作或者异步操作的情况。

1.6K1 0

2018前端值得关注的技术

说到parcel的最大优势，貌似就是webpack的最大劣势：配置和性能！parcel号称零配置，多核打包，并且使用文件缓存，在时间上比webpack快了将近10倍！...这意味着浏览器端的性能会得到极大提升，它也使得我们能够实现一个底层构建模块的集合，例如，强类型和块级作用域。...在2017的调查报告里面可以看到，趋势基本上是react已经占据主流，不使用框架位居第二，angular1，angular2分列三四。...18年，angular还是会和react和vue齐名的三大框架，只是使用者不如react和vue那样多。 jquery jquery在2018年也不会没落，只是使用率还是会进一步的减少。...说到jquery，还真是一个时代的转变，在我刚接触前端的时候，jquery打天下。那个时候相对于其他的库和框架，jquery就是一个巨无霸，使用率遥遥领先。

1.9K15 0

前端模块化方案：前端模块化插件化异步加载方案探索

js语言本身并不支持模块化，同时浏览器中js和服务端nodejs中的js运行环境是不同的，如何实现浏览器中js模块化主流有两种方案：requirejs/seajs: 是一种在线“编译”模块的方案，相当于在页面上加载一个...DOM中，监听完成的事件，然后递归加载依赖：...或者如下调用指明的函数名称.../local-module.js'); // 加载绝对url的地址 SystemJS.import('https://code.jquery.com/jquery.js');可以加载任何类型的模块格式...('jquery.js');更多的参看官方文档：https://github.com/systemjs/systemjses5时代模块打包方案Grunt和Gulp属于任务流工具Tast Runner...早期需要手动在命令行中输入 jshint test.js，而 Grunt 则通过文件 Gruntfile.js 进行配置Gulp吸取了Grunt的优点，拥有更简便的写法，通过流（Stream）的概念来简化多任务之间的配置和输出

2.2K2 0

npm、npm scripts

每个项目的根目录下面，一般都有一个package.json文件，定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。...区别在于：当你把项目发布上线后，别人使用 npm install使用你的项目时，并不会下载devDependencies里的模块。 4、node_modules的查找路径是怎样的?...大多数内容功能都是基于这个插件系统运行的，还可以开发和使用开源的 webpack 插件，来满足各式各样的需求。 webpack使用异步 I/O 和多级缓存提高运行效率，使得它能够快速增量编译。...如何使用？ package.json 文件有一个 scripts 字段，可以用于指定脚本命令，供 npm 直接调用。...使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并 gulp是前端开发过程中对代码进行构建的工具，是自动化项目的构建利器 gulp不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成

2.7K4 1

Gulp 在金蝶云平台项目中的使用经验

/lib/jquery-1.11.1.min', widget: '.....: 'src/js/config.js', exclude: [ 'jquery' ] })) .pipe(gulp.dest('dist/js/...还有，由于项目原因，开发的时候不能使用到 127.0.0.1 ，想换成 php 配置的域名怎么做？...如果你也使用过 Grunt，那我相信你一定能够很快地切换到 gulp。当然如果你没有接触过 Grunt，我相信你一定也能够很快上手 gulp。...其中专门创建一个 gulp 目录用来存放 gulp 代码，为了能够将任务更加细化，职责单一，方便日后的维护更新。

2.2K0 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭