Giter VIP home page Giter VIP logo

Comments (5)

SkipTyler avatar SkipTyler commented on May 27, 2024 1

Yes, it works! That's cool! @dvlden Thank you so much !

from webpack-config.

dvlden avatar dvlden commented on May 27, 2024

Hmmm let me think, haven't used that one in a while...

I think:

  • Yes, you uncomment this code block in plugins as you already did

// new plugins.sync({
// proxy: proxyDomain,
// files: [
// {
// match: ['**/*.html'],
// fn: (event, file) => {
// if (event === "change") {
// const bs = require('browser-sync').get('bs-webpack-plugin');
// bs.reload();
// }
// }
// }
// ]
// })

  • Uncomment also this line and change the string value to match your own v-host domain

// const proxyDomain = 'http://demo.test/'

  • I think you should also uncomment this code block, as you won't be using it anymore

devServer: {
contentBase: path.join(__dirname, 'src'),
overlay: {
warnings: true,
errors: true
},
quiet: true
},

Now, I am unsure if you must setup virtual host domain, or you can simply create an server with php-cli or python or such... And point this instead of v-host domain to a variable.

For example:

cd ~/Sites/an-project/
php -S localhost:8000

from webpack-config.

SkipTyler avatar SkipTyler commented on May 27, 2024

So
I have done all of the above. Did not help. It still does not work.
The only thing I did not understand.
Do I need to change the proxyDomain? Or can you leave this?
Errors still remained.

P.S. I do not use php :)

from webpack-config.

SkipTyler avatar SkipTyler commented on May 27, 2024

So. I solved the problem with these errors. I ran out of file descriptors. This happens on Linux OS
There remains one more problem. Opens http: // localhost: 3000 / but can not load the page.
I have commented on this code

        // devServer: {
        //     contentBase: path.join(__dirname, 'src'),
        //     overlay: {
        //         warnings: true,
        //         errors: true
        //     },
        //     quiet: true
        // }, 


not looking at it, my site works on 8080 port

I run dev script

"scripts": {
    "dev": "webpack-dev-server --progress --mode development",
    "watch": "webpack --watch --progress --hide-modules",
    "build": "webpack --progress --hide-modules --mode production"
  },

If you run it with webpack instead of webpack-dev-server
That does not work at all
I also wrote a watch script. Nothing changed.
I also want to note that UI: http: // localhost: 3001 opens


  "browser-sync": "^2.24.4",
    "browser-sync-webpack-plugin": "^2.2.2",

I was wondering if there could be a problem with the paths.

match: ['**/*.html'],

from webpack-config.

dvlden avatar dvlden commented on May 27, 2024

@SkipTyler I honestly cannot really remember why I did the setup for browsersync that way... I think I used it only in php projects, but file-match tells differently...

I have read the docs of browser-sync and saw that we can actually use both webpack-dev-server and browser-sync by using proxy argument.

That is all now enabled and you can try it out...

from webpack-config.

Related Issues (10)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.