之前在百度上看到过很多中  关于局域网访问项目的方法, 在这里,个人推荐两种比较喜欢的方法 一.直接在项目的package.json文件中进行配置 ,代码如下 "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 192.168.0.122", "build": "no

在webpack配置文件下改为 host:'0.0.0.0' 改为后启动跳转不到登录页面 需手动修改浏览器上的0.0.0.0:8080为自己ip加上:8080 就可以在别的电脑上进行访问了 举一反三: 严格说来,0.0.0.0已经不是一个真正意义上的IP地址了.它表示的是这样一个集合:所有不清楚的主机和目的网络.这里的“不清楚”是指在本机的路由 表里没有特定条目指明如何到达.对本机来说,它就是一个“收容所”,所有不认识的“三无”人员,一 律送进去.如果你在网络设置中设置了缺省网关,那么Windo

1.检查 package.json文件,scripts.dev设置 host改成 "0.0.0.0" 2.config文件中找到 index.js 文件的host改成 "0.0.0.0" 3.查看本机IP地址

vue配置手机通过IP访问config/index.js// Various Dev Server settings host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8088, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: false, erro

vue项目package.json "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0",在dev 后面加入--host 0.0.0.0 即可在npm run dev 后通过局域网访问192.168.xxx.xxx:xxxx

1.想要在手机上访问本地的vue项目,首先要保证手机和电脑处在同一局域网内(连着同一个无线网) 2.将你电脑的ip设置为固定ip(ipconfig查找本地的ip,然后修改它,改为你想变的数字) 3.在vue项目中的 config文件中的index.js内,将host的配置改为本低局域网的ip————如:192.168.1.111 4.同样的,在vue项目中找到packahe.json,在scripts内的dev中加入 --host 192.168.1.111 注:--host 192.168.1

一般使用 vue-cli 下来的项目是可以直接访问局域网 IP 打开的,比如 192.168.1.11:8080 .但是最近公司的一个项目只可以通过 localhost 访问. 需要配置一下,才可直接用局域网 IP 访问,方法如下: 给 dev 添加--host 0.0.0.0 属性: "scripts": {   "dev": "webpack-dev-server --inline --progress --config build/webpack.d

1. 下载 wget http://nginx.org/download/nginx-1.12.2.tar.gz 2. 解压缩 tar -zxvf linux-nginx-1.12.2.tar.gz cd nginx-1.12.2/ 3. 执行配置 ./configure 4. 编译安装 make make install 5. 启动 nginx /usr/local/nginx/sbin/nginx 访问服务器Ip即可进入welcome to Nginx页面,说明配置成功 5. 部署vue项目

正常开发中有时间提测比较麻烦.通常让测试小姐姐连接开发本地开启的服务器访问本地项目(在同一局域网下). 其实一般项目IDE已经实现这些功能例如webstorm和vscode,有时候需要单独配置下. 但是Vue项目在本地开发环境中他们就没办法通过IDE去开启服务器,一般都是是vue-cli脚手架开启服务器的这时候就需要我们做些特别的配置了. 首先需要获取自己的ip,我本人使用mac 在iterm中输入 ifconfig en0 可以拿到自己的IP inet 10.101.2.43 window系统

2.使用vue-cli起的服务器无法在局域网访问 这个很简单,在package.json文件中的js启动项配置中增加--host 0.0.0.0 注意是--host而不是-host,此时如果有--open的话,打开页面是无效的,此时你需要打开你的config文件夹下index.js中的配置的域名和端口, 同时,你的域名的访问:192.168.xx.xx:9998,此时也是可以访问的 查询你的计算机域名可以使用ipconfig命令:

在写vue的项目中时,虽然vue会自动更新页面,但是切换页面切来切去也很麻烦,有时候我们还要在公司另一台电脑或者手机上调试,这时候利用browser-sync插件,无需改动vue的代码即可实现: 1. 首先确保安装了node (命令行node -v 可以查看) 2.全局安装 browser-sync      npm install -g browser-sync (项目中局部安装  npm install --save-dev browser-sync) 3.启动vue项目 npm run d

之前,UI看做好的页面效果,一直都是把项目打包好后放上服务器跑. 现在,UI能实时看到我的项目的页面效果情况了. 那么问题来了!!! 要怎样做到呢??? 接下来照做就行了!!! 请您先打开项目下的package.json文件 找到dev这一行 加上-- host 192.168.1.1  (你的本机地址) "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --ho

先试 ng serve --host 0.0.0.0 不行再试 ng serve --host 0.0.0.0 --disable-host-check

最近我朋友王小闰他们公司的项目开发已经进入收尾阶段,前后端并行开发的差不多了,联调也调过了,上篇文章里也讲到了,所谓联调,就仿佛在说“我也不知道我的接口文档写的对不对,我们验证一下吧?我也不知道我的数据处理逻辑对不对,我们验证一下吧?”, 哈哈哈,自嘲一下~ 当一切准备就绪,此时就剩下了完成项目的最后一公里,即真机测试和打包上线. 那么如何在vue项目里做真机测试呢?王小闰准备在leader面前大展身手,展示下自己最近的学习成果,让我们跟着王小闰的节奏操练起来~ 首先需要在命令行中输入 npm

vue配置手机通过IP访问电脑开发环境config/index.js// Various Dev Server settings host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8088, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: false

记录近期换工作时遇到的面试题和面试题答案 css 部分 盒模型 问题:说一下 css 的盒模型 盒模型分为标准模型和怪异盒模型(IE 盒模型) 标准盒模型:盒模型的宽高只是内容(content)的宽高 怪异盒模型:盒模型的宽高是内容(content)+填充(padding)+边框(border)的总宽高 问题:css 如何设置两种模型 /* 标准模型 */ box-sizing:content-box; /*IE模型*/ box-sizing:border-box; 问题:有没有遇到过边距重叠,

目录 1 webpack简介 2 webpack实现多个输入输出多个html 3  webpack 中的module下rules 下的use和loader选项 4 webpack 文件更新,如何使页面重新加载,而不是使用缓存,hash(版本号更新) 5 webpack output 里面的publicPath 6 webpack热加载 热更新 热替换 7 webpack dev-server 和nginx服务器之间的关系 8 webpack 构建的vue项目总是会出现内容先于样式出现的很乱的页面

1.熟悉项目开发流程 需求分析——>脚手架工具——>数据mock——>架构设计——>代码编写——>自测——>编译打包. 2.熟悉代码规范 从架构设计.组件抽象.模块拆分,到代码风格统一.CSS代码规范和JavaScript变量命名规范,以标准写代码,开发出扩展性.通用性强的优质代码. 3.掌握Vue.js在实战中应用 4.学会使用Vue.js完整地开发移动端App 5.学会工程化开发.组件化开发和模块化开发的方式 6.酷炫的交互设计 所用到的技术 后端:vue-reso

1.组件引入css. 例:test.vue引入swiper.min.css | -- src |  | -- components | | -- test |  | -- test.vue | | -- css |   | -- swiper.min.css <script> import '../../css/swiper.min.css';</script> 组件所在处为相对位置. 2.全局安装vue-cli 首先确保安装node,检查node-v;. 在node目录下输入:

1.页面骨架开发 1.1组件拆分 手机浏览器是把页面放在一个虚拟的“窗口”(viewport)中,通常这个虚拟的“窗口”(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局),用户可以通过平移和缩放来看网页的不同部分. <meta name="viewport" content="width=device-width,inital-scale=1.0, maximum-scale=1.0,user-scalab