vue 一个简单的项目 之四 最终 step2 真机测试

首先，查看一下自己电脑在内网的ip 地址。ifconfig / ipconfig 命令。

然后，我们将项目地址中的 localhost 换成 自己的ip 。会发现不能用。

这是因为webpack dev server 默认不支持通过ip 的形式，进行页面的访问。因此，我们要对它默认的配置项进行修改。

打开项目根目录下的 package.json, 往“script” 中的“dev” 加入一些项

这是原来的：

{
  "name": "travel",
  "version": "1.0.0",
  "description": "A Vue.js project",
  "author": "Jessy",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "lint": "eslint --ext .js,.vue src",
    "build": "node build/build.js"

新的：

{
  "name": "travel",
  "version": "1.0.0",
  "description": "A Vue.js project",
  "author": "Jessy",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --host 0.0.0.0 --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "lint": "eslint --ext .js,.vue src",
    "build": "node build/build.js"
  },

保持，重启服务器。然后试试使用ip 就可以在电脑上打开了。

然后我们在手机浏览器上，使用同样的地址就可以进行测试了，要注意，手机和电脑在同一个内网。