温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

grunt使用watch和livereload的Gruntfile.js的配置

发布时间:2020-06-29 11:07:29 来源:网络 阅读:335 作者:张涛泽 栏目:网络安全

 周末在家看angularJS, 用grunt的livereload的自动刷新, 搞了大半天, 现在把配置贴出来, 免得以后忘记了, 只要按照配置一步步弄是没有问题的;

  开始的准备的环境安装是:

  (1):nodeJS,去官方网站下载(href); 

  (2):然后把nodeJS加到全局的环境变量里面去(nodeJS安装好了就能用npm这个命令了),参考(href);

  (3):执行npm install grunt -g 和 npm install -g grunt-cli,一个是安装服务端的gurnt一个是客户端的grunt(反正都安装就好了),参考(href)

  

  第一步:新建一个叫做Gruntfile.js的js文件

运行下面代码

grunt使用watch和livereload的Gruntfile.js的配置

module.exports = 'package.json'9000'127.0.0.1', 
                livereload: 35729  , "html"                          35729 '**/*''default',["connect","watch"'grunt-contrib-watch''grunt-contrib-connect'

grunt使用watch和livereload的Gruntfile.js的配置

  

  2:新建一个package.json的文件, 直接在cmd(命令行)下执行npm install即可把所有的node_module自动下载下来;

运行下面代码

grunt使用watch和livereload的Gruntfile.js的配置

{    "name": "nono",    "version": "0.0.0",    "description": "for watch",    "main": "Gruntfile.js",    "dependencies": {    "grunt": "~0.4.5",        "express": "~3.15.2",        "grunt-contrib-connect": "~0.6.0",        "grunt-contrib-watch": "~0.5.3"},    "devDependencies": {},    "scripts": {    "test": "echo \"Error: no test specified\" && exit 1"},    "repository": {    "type": "git",        "url": "sqqihao.github.com"},    "keywords": [    "nono"],    "author": "nono",    "license": "__MIT__"}

grunt使用watch和livereload的Gruntfile.js的配置

  

  好了, 现在在当前目录下执行grunt, grunt会自动监控所有文件的变化, 当你的文件一旦发生改变的,  你通过127.0.0.1打开的所有html格式文件都会自动刷新;新航道雅思

;


向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI