mcfly-io / generator-mcfly

A Yeoman generator for scaffolding an application using angular, browserify, ionic and famous
323 stars 43 forks source link

Watch is not working, after the first time files being changed . #291

Closed yssource closed 9 years ago

yssource commented 9 years ago

1) Watch is not working, after the first time files being changed . 2) How to configure and use 'webpack-dev-server', if I wanna use the function for 'hot module loading' HotModuleReplacementPlugin 3) I add the codes in file ./gulp_tasks/common/constants.js. webpack: { src: [ 'webpack/hot/dev-server', 'webpack-dev-server/client?http://localhost:5000', './main{{targetSuffix}}.js' ] }

and add codes in file ./webpack-config.js new webpack.HotModuleReplacementPlugin(); But, it does not work.

![Uploading Screenshot from 2015-11-01 02-06-10.png…]()

thaiat commented 9 years ago

what does it mean watch is not working? please give details on the command you are running, the files you are modifying so we can reproduce the issue

thaiat commented 9 years ago

also your comment does not include screen shot...

thaiat commented 9 years ago

sorry didn't mean to close the issue

jskrzypek commented 9 years ago

Also, it looks like you meant to upload a screenshot but there isn't one attached...

thaiat commented 9 years ago

@yssource havent heard from you... closing this issue for now, please feel free to reopen

yssource commented 9 years ago

I'm sorry responding to you so lately. I want to use your project configed with webpack.

  1. change the line to be: “moduleManager: 'webpack', // or webpack” in file ./glue_tasks/common/constants.js
  2. run command 'gulp browsersync'
  3. try to edit the ./index.html which is under my root source directory './client'

For instance. change this line '6XXXXXX' As a result, the browser's going to refresh the page automatically. I think this is what I expected. On the console, log will be output “[BS] File changed: dist/app/dev/www/index.html”.

Then try to change the./index.html again, '6YYYYYY' But, this time the browser never refresh the page any more. The page still dispays 6XXXXXX, actually it should be refresh to be 6YYYYYY. On the console, No log will be output.

For a workaround, I add the following codes in file ./task/serve.js to make it refresh automatically.

bs.watch(constants.clientFolder, { ignoreInitial: true }, function() { gulp.start('html'); });

yssource commented 9 years ago

My second question seems to be concerning with webpack.

I add a new entry for webpack config in file ./glue_tasks/common/constants.js It looks like this

    webpack: {
        src: {
            bundle: [
            'webpack/hot/dev-server',
            'webpack-dev-server/client?http://localhost:8081',
            './main{{targetSuffix}}.js'
            ],
            'vendors': ['ionic-bundle']
            }
    },

and in file webpack.config.js

plugins: [ new webpack.HotModuleReplacementPlugin(), ... ]

As a result, lots of error logs will be output. GET http://localhost:8081/socket.io/?EIO=3&transport=polling&t=1446801519053-399 net::ERR_CONNECTION_REFUSED I wander to know how to config the hot module replace correctly with your project.