Vue-cli down general use of the project is to open direct access to the LAN IP, such as 192.168.1.11:8080. But recently the company's project can only be accessed via localhost.
It needs to be configured before they can be accessed directly with the LAN IP, as follows:
Add to dev --host 0.0.0.0 attributes:
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0", "start": "npm run dev", "unit": "jest --config test/unit/jest.conf.js --coverage", "test": "npm run unit", "build": "node build/build.js" },
So you can use the phone to access the computer's IP directly open the project site.
If you still can not access, you need to configure about the computer 's firewall , the required port (eg: 8080) Open.
Set as follows:
Windows 10, search for "Control Panel", open, Windows 7 can be opened directly from the Start menu.
Click on "Windows Defender Firewall" - "Advanced Settings" - New "network rules."
Rule Type Select "Port" next step "specific local port" fill 8080-8088 (Here is an IP segment, because if you open multiple projects, ports will be occupied, Vue will automatically assign a new port, such as: 8081 ).
Next "allow connection", select open next scene, I chose the first two, the next step enter the rule name, click "Finish".
So using a mobile phone to access your computer's IP plus port number, 192.168.1.11: 8080 you can open the project.
The method of obtaining computer IP:
Win + R Run "cmd", type ipconfig Enter, you can see their IP, and like my 192.168.2.103.
This is more convenient device debugging without the need to deploy to the server can be accessed and tested.
Disclaimer: This article from the original w3h5, please indicate the source: "Vue project can not be used to configure the LAN IP direct access" https://www.w3h5.com/post/459.html