webpack-dev-server远程访问配置方法
下面的package.json文件中配置的webpack-dev-server为开发模式,可以使用http://localhost:8080或http://127.0.0.1:8080进行访问
"scripts": { "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", "build": "rimraf dist && cross-env NODE_ENV=production webpack --progress --hide-modules" },
当需要远程访问时,需要在package.json中进行修改
"scripts": { "dev": "webpack-dev-server --host 10.30.1.102 --devtool eval --progress --colors --hot --content-base build", "build": "rimraf dist && cross-env NODE_ENV=production webpack --progress --hide-modules" },
此时,可以通过http://192.168.10.8:8080或http://127.0.0.1:8080这种形式进行访问,但是http://localhost:8080无法进行访问。
以上这篇webpack-dev-server远程访问配置方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
您可能感兴趣的文章:
- 详解webpack-dev-server使用http-proxy解决跨域问题
- 深入理解Webpack 中路径的配置
- webpack常用配置项配置文件介绍
- vue项目中的webpack-dev-sever配置方法
- webpack-dev-server自动更新页面方法
相关推荐
-
vue项目中的webpack-dev-sever配置方法
问题描述:在vue项目中运行npm run dev启动服务器,然而在同一个局域网下的外部设备不能该服务器 解决方案:在项目的config文件夹下找到index .js中的host把默认的localhost更改为0.0.0.0, 然后外部设备就可以访问该项目启动的服务了(注意必须是在统一局域网下) 以上这篇vue项目中的webpack-dev-sever配置方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
详解webpack-dev-server使用http-proxy解决跨域问题
文档资料 webpack关于webpack-dev-server开启proxy的官方介绍 Vue-cli proxyTable 解决开发环境的跨域问题--虽然这篇是写vue的,不过用在webpack-dev-server上也是一样的 http-proxy-middleware--webpack-dev-server的实现方法其实是对这个的封装 配置http-proxy 在webpack的配置文件(webpack.config.js)中进行配置 module.exports = { ...此处省略
-
深入理解Webpack 中路径的配置
前言 Webpack2 中有很多涉及路径参数配置,若不知其所以然,很容易混淆出错.本文尽可能的汇集了 Webpack2 中涉及路径的配置,力争深入浅出. context context 是 webpack 编译时的基础目录,入口起点(entry)会相对于此目录查找. 默认值为当前目录,webpack设置 context 默认值代码 可以本地下载: this.set("context", process.cwd()); process.cwd()即webpack运行所在的目录(等同pac
-
webpack常用配置项配置文件介绍
一.webpack基础 1.在项目中生成package.json:在项目根目录中输入npm init,根据提示输入相应信息.(也可以不生成package.json文件,但是package.json是很有用的,所有建议生成) 2.安装webpaack a.在全局中安装webpack:npm install webpack -g b.将webpack安装到项目并将webpack写入package.json的devDependencies中:进入项目根目录,然后在命令行中输入npm install w
-
webpack-dev-server自动更新页面方法
这两天在看webpack,今天卡在webpack-dev-server上了,折腾了一下午,一直无法正常运行,每次服务器也提示正常启动了,但是浏览器一输入localhose:8080/admin就提示Get/...,反正就是无法打开页面.最后找到一个帖子,发现原来是我启动服务器的代码有问题. 先安装webpack相关组件 cnpm i webpack-dev-server --save-dev cnpm i webpack --save-dev 代码如下: 1.项目结构如下: 2.webpack.
-
关于Webpack dev server热加载失败的解决方法
利用Webpack dev server作为热加载服务器时,出现以下错误: XMLHttpRequest cannot load http://localhost:8080/dist/06854fc8988da94501a9.hot-update.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not
-
webpack-dev-server远程访问配置方法
下面的package.json文件中配置的webpack-dev-server为开发模式,可以使用http://localhost:8080或http://127.0.0.1:8080进行访问 "scripts": { "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", "build": "rimraf dist &
-
Linux下用dnsmasq做dns cache server的配置方法
目前最新版是2.7.1 ,可去其FTP下载:http://www.thekelleys.org.uk/dnsmasq/ 安装过程比较简单 yum -y install dnsmasq* wget http://www.keepalived.org/software/keepalived-1.2.9.tar.gz tar zxvf keepalived-1.2.9.tar.gz cd keepalived-1.2.9 ./configure --prefix=/usr/local/keepaliv
-
Nagios监控Windows Server 2008配置方法
1.安装NSClient++ 访问http://nsclient.org/nscp/下载NSClient++,这里我使用的是NSClient++-0.3.9-x64的msi安装包.下载之后直接安装,过程中会提示输入Nagios监控服务器地址和密码.地址填写正确,密码不用设置.Nagios监控服务器事先在监控Linux服务器时候已经搭建好,以后再和大家分享.安装如下图所示: 2.配置NSClient++ 编辑安装目录下的NES.ini文件,打开NSClient++的端口.方法为找到:[NSClie
-
Centos 7.3下SQL Server安装配置方法图文教程
以后工作都将与Linux打交道,对于.net忠实粉丝现在进入Linux还算幸运,因为.net core和asp.net core都已经跨平台了.今天没事想试试传说中的Linux Sql server是不是上手容易. 安装SQL Server到Centos 7.3 官方文档:https://docs.microsoft.com/en-us/sql/linux/quickstart-install-connect-red-hat OS必须条件: cat /etc/redhat-release 1.设
-
WebsitePanel Standalone Server安装配置方法
WebsitePanel安装好之后,我们会看到桌面多了一个WebsitePanel Installer,双击这个程序之后看到: 接下来我们只要安装WebsitePanel Standalone Server就可以使用WebsitePanel了.首先我们点击WebsitePanel Standalone Server Setup右边的Install看到: 点击Next看到: 点击I Agree看到: 点击Next看到: 填写相应的服务器IP和主机名(域名最好是有效域名,设置好之后就可以通过域名访问
-
vue2.0在没有dev-server.js下的本地数据配置方法
问题描述: 在vue2.0的以上的版本,vue-cli的build的文件夹下没有dev-server.js文件,那怎么配置mock数据 Vue2.x在build下的webpack.dev.conf.js配置就行 //在const portfinder = require('portfinder')后添加 const express = require('express') // nodejs开发框架express,用来简化操作 const app = express() // 创建node.js
-
详解node.js中的npm和webpack配置方法
概述 Node.js用c++语言编写而成的,是一个基于chrome V8引擎的javascript运行环境,让javaScript的运行脱离浏览器服务端,可以使用javaScript语言书写服务器端代码 1.使用node来实现一个http服务器 下面创建了一个端口为8787的服务器.他与php,java等不同,像php本地还要基于阿帕奇服务器,node.js能用代码快速搭建一个服务器. // 引入http模块 var http = require("http"); // 调用http的
-
详解vue-cli脚手架中webpack配置方法
什么是webpack webpack是一个module bundler(模块打包工具),所谓的模块就是在平时的前端开发中,用到一些静态资源,如JavaScript.CSS.图片等文件,webpack就将这些静态资源文件称之为模块 webpack支持AMD和CommonJS,以及其他的一些模块系统,并且兼容多种JS书写规范,可以处理模块间的以来关系,所以具有更强大的JS模块化的功能,它能对静态资源进行统一的管理以及打包发布,在官网中用这张图片介绍: 它在很多地方都能替代Grunt和Gulp,因为它
-
webpack+vue+express(hot)热启动调试简单配置方法
前言 最近搞vue+webpack,vue的api还是比较容易懂的,每次build很复杂,这里就介绍下热启动调试吧,心累~~~ ITDogFire –sky 工具及目录 所用的到的简单工具 webstorm +vue +webpack +express,小项目都是官方down下来的. 目录介绍如下 package { "name": "yx", "version": "1.0.0", "description&quo
随机推荐
- 详解C++编程中表达式的语义与计算顺序
- PHP登录环节防止sql注入的方法浅析
- Python兔子毒药问题实例分析
- Java 获取URL的内容
- Android仿人人网滑动侧边栏效果
- MySQL定时备份之使用Linux下的crontab定时备份实例
- Go语言实现的一个简单Web服务器
- 看图理解 普通交互方式和Ajax交互方式区别
- 探索PowerShell(十三) WMI对象介绍
- mysql数据库修改添加Date格式列的方法
- Asp.net在IIS上运行不了的解决方法
- 谈谈JavaScript自定义回调函数
- Thinkphp连表查询及数据导出方法示例
- 利用PHP将部分内容用星号替换
- Android使用CountDownTimer类实现倒计时闹钟
- Java实现abc字符串排列组合
- 关于PHP隐藏入口文件问题
- vue中组件的3种使用方式详解
- python画图——实现在图上标注上具体数值的方法
- Flutter下载更新App的方法示例