swashata / wp-webpack-script

💥🔥📦👩‍💻 An easy to use, pre configured, hackable webpack setup & development server for WordPress themes and plugins.
https://wpack.io
MIT License
408 stars 57 forks source link

Install on Laravel Homestead can't view wpack.io server #860

Open tonyclemmey opened 4 years ago

tonyclemmey commented 4 years ago

Hello,

I am a first time user trying to use wpack and my existing setup consists of using Laravel Homestead as the development server for Wordpress site. My homestead YAML configuration is pretty standard as you can see below.

---
ip: "192.168.10.10"
memory: 2048
cpus: 2
provider: virtualbox
ssl: true

folders:
    - map: ~/homestead-sites/site1
      to: /home/vagrant/code/site1

    - map: ~/homestead-sites/ssl-certs
      to: /home/vagrant/code/ssl-certs

sites:
    - map: site1.test
      to: /home/vagrant/code/site1
      php: "7.3"
      type: "apache"

databases:
    - site1

# ports:
#     - send: 50000
#       to: 5000
#     - send: 7777
#       to: 777
#       protocol: udp

& in my hosts file

192.168.10.10 site1.test

I have an existing WordPress install in the root of this site (with trusted SSL) and I have followed the steps to install in the theme dir.

  1. npx @wpackio/cli
  2. npm run bootstrap
  3. composer require wpackio/enqueue
  4. npm start
✔ startup: .
✔ project config: wpackio.project.js
✔ server config: wpackio.server.js

✔ wpack.io server is running at.

    ❯ http://192.168.0.36:3000

and BrowserSync UI running at

    ❯ http://192.168.0.36:3001

Press r to recompile and q to force quit.
To create production build, run

    ❯ npm run build

No files are written on disk during development mode.

「wpack.io 21:56:08」 ✔ compiled successfully
「wpack.io 21:56:08」 ✔ bundle was built in 422ms.
「wpack.io 21:56:08」 ℹ watching for changes…

http://192.168.0.36:3001 displays the BrowserSync page, but http://192.168.0.36:3000 seems to just loop/timeout loading.

I can run $ npm run build also with no issues.

✔ startup: .
✔ project config: wpackio.project.js
✔ wpack.io build successful.

 OUTPUT

                      Asset       Size  Chunks                         Chunk Names
       app/main-47e86c11.js    2.6 KiB       0  [emitted] [immutable]  main
   app/main-47e86c11.js.map   7.71 KiB       0  [emitted] [dev]        main
          app/manifest.json  409 bytes          [emitted]
    app/runtime-3d015d32.js   1.87 KiB       1  [emitted] [immutable]  runtime
app/runtime-3d015d32.js.map    8.1 KiB       1  [emitted] [dev]        runtime

wpack.io production build was successful.

So it just the wpack.io server on port 3000 not loading for me. Any guidance would be appreciated

Tony

swashata commented 4 years ago

Hello,

I am thinking you have https://site1.test in your wpackio.server.js file. Note the https. If this is the case, then kindly access the development server from https://192.168.0.36:3000, ie from https link.

Possibly related to #454

michaelw85 commented 3 years ago

With the info provided by @swashata I got it working like this:

host: "site1.test",
proxy: "https://site1.test",
bsOverride: {
        https: {
            key: "/Users/<user>/.config/valet/Certificates/site1.test.key",
            cert: "/Users/<user>/.config/valet/Certificates/site1.test.crt",
        },
 },

Replace <user> in this example for the certificates

swashata commented 3 years ago

Thank you @michaelw85 for your input. It would be great if this can be added to the Tutorial Section of the documentation. Let me know if you are willing to do that. I will guide you through the process.