使用webpack dev server通过本地IP启动服务器后invalid host header的错误解决办法

最近在研究webpack,本来前阵子webpack dev server还配置的挺正常的…今天突然重新搭环境的时候跑不起来了…不知道是不是版本原因导致的,反正现象是

webpackDevServer服务器启动正常,进行localhost:9000访问正常,但是用本地的ip例如我IP是192.168.1.100,于是在浏览器中访问192.168.1.100:9000则出现了invalid host header.

那么解决这个问题也是差了不少资料.如果你存在此问题可以尝试一下方法:

首先说明环境 webpack 2.6.1 + webpackDevServer 2.5.0

我本来的webpack.config.js文件内的webpackDevServer配置如下

devServer: {
    contentBase: __dirname,
    compress: true,
    port: 9000,
    inline: true,
    host: '0.0.0.0'
}

有人说要加一个

disableHostCheck: true

不过不知道这里是没有效果的

又查到说加了一个public参数,试了下就好了.所以就分享下.完整的效果是

devServer: {
    contentBase: __dirname,
    compress: true,
    port: 9000,
    inline: true,
    host: '0.0.0.0',
    disableHostCheck: true,
    public: '192.168.1.107'
}

PS:后来发现用disableHostCheck: true其实也行了,大概是缓存原因没有及时看到效果,不论怎么样…出现这种问题的朋友都可以试试咯~

参考

–host 0.0.0.0 Not working
I am getting an “Invalid Host header” message, when running my React app in a Webpack dev server on Cloud9.io
webpack-dev-server2.4.3版本的官方说明
webpack-dev-server disableHostCheck导致 invalid host header

Windows 10 64bit 下nodejs报错”MSBUILD : error MSB4132:…”解决

在win10 64位系统下,关于nodejs下通过npm install环境部署项目时出现报错’MSBUILD : error MSB4132: 无法识别工具版本“2.0”。可用的工具版本为 “4.0”。’的解决办法

最近用自己笔记本办公配置windows 10下的开发环境(当然不排除WIN7下也有可能存在此问题),其中在进行一个项目的NPM INSTALL的时候一直出错…错误如下

关于NPM INSTALL相关错误信息
关于NPM INSTALL相关错误信息

找了很多解决办法…都无效.十分沮丧…前几天在win7 64bit下也是折腾了好几天.依赖关系实在是复杂- –

我先来说说这个问题怎么处理吧.经过大量查找研究得出的结论…用了一行这个命令:

npm config set msvs_version 2012 --global

参考资料:

MSBUILD : error MSB4132: The tools version “2.0” is unrecognized. Available tools versions are “4.0”.(用户shawmanz32na的回答,也包含其他可能存在的问题的解决集合链接)

Cannot install node modules that require compilation on Windows 7 x64/VS2012

当然也有人说修改注册表的方法,虽然我也用了不过没什么效果.我现在想还原注册表都不行了- -没备份.这里如果大家在试了以上方法仍然无效的情况下可以试试修改注册表的这块的版本号,但是个人不建议,或者提前做好注册表备份.这里不详细说明注册表方法,给个链接大家参考MSBUILD : error MSB4132: 无法识别工具版本“2.0”。可用的工具版本为 “4.0”。

当然可能还存在其他的问题比如缺少VC++ 20XX运行库什么的

可以试试这个软件下载站的工具常用运行库合集(VB+VC运行库)

以上链接怀疑包含广告,暂时删去,还是用一下3DM的运行库吧http://dl.3dmgame.com/201707/110601.html

 


更新2018.4.12

如果以上方案还是有问题, 比如我今天就出现这个情况了。。。然后又苦恼这个坑爹博主刚才那条命令搞了啥,想要还原,其实我就是改了一下全局的npm中微软编译时依赖库版本,文件路径在这

C:\Users\whidy\AppData\Roaming\npm\etc

你要是不爽就把这个里面的文件npmrc删掉就好了,然后再采取最后一个终极方案。前提你的确装了一些库,不过以下会再重新安装一下。方式如下:

  1. 管理员权限的Windows PowerShell或CMD,执行npm install --global --production windows-build-tools
  2. 如果没有手动安装过Python则在上面一步自动安装Python后可能需要手动配置一下环境变量,Windows PowerShell或CMD中执行npm config set python python2.7
  3. 重新设置该项目的msvs版本,同样Windows PowerShell或CMD中执行npm config set msvs_version 2015,或者全局的话加个-g

再在项目中运行npm install,可能会出现很多警告,但是这些可以忽略的。

我不信还会出问题- -!

如果提示这些错误信息

MSBUILD : error MSB3428: 未能加载 Visual C++ 组件“VCBuild.exe”。要解决此问题,1) 安装 .NET Framework 2.0 SDK;2) 安装 Microso
ft Visual Studio 200
5;或 3) 如果将该组件安装到了其他位置,请将其位置添加到系统路径中。 [D:\Webs\infinite-scroll-vuejs\node_modules\node-sass\build\binding.sln]

也可以按上面的方法尝试解决:

参考:node-gyp

附上MSVSVersion版本说明:

versions = {
  '2017': VisualStudioVersion(
    '2017',
    'Visual Studio 2017',
    (solution_version = '12.00'),
    (project_version = '15.0'),
    (flat_sln = False),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v141'),
    (compatible_sdks = ['v8.1', 'v10.0'])
  ),
  '2015': VisualStudioVersion(
    '2015',
    'Visual Studio 2015',
    (solution_version = '12.00'),
    (project_version = '14.0'),
    (flat_sln = False),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v140')
  ),
  '2013': VisualStudioVersion(
    '2013',
    'Visual Studio 2013',
    (solution_version = '13.00'),
    (project_version = '12.0'),
    (flat_sln = False),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v120')
  ),
  '2013e': VisualStudioVersion(
    '2013e',
    'Visual Studio 2013',
    (solution_version = '13.00'),
    (project_version = '12.0'),
    (flat_sln = True),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v120')
  ),
  '2012': VisualStudioVersion(
    '2012',
    'Visual Studio 2012',
    (solution_version = '12.00'),
    (project_version = '4.0'),
    (flat_sln = False),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v110')
  ),
  '2012e': VisualStudioVersion(
    '2012e',
    'Visual Studio 2012',
    (solution_version = '12.00'),
    (project_version = '4.0'),
    (flat_sln = True),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based),
    (default_toolset = 'v110')
  ),
  '2010': VisualStudioVersion(
    '2010',
    'Visual Studio 2010',
    (solution_version = '11.00'),
    (project_version = '4.0'),
    (flat_sln = False),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based)
  ),
  '2010e': VisualStudioVersion(
    '2010e',
    'Visual C++ Express 2010',
    (solution_version = '11.00'),
    (project_version = '4.0'),
    (flat_sln = True),
    (uses_vcxproj = True),
    (path = path),
    (sdk_based = sdk_based)
  ),
  '2008': VisualStudioVersion(
    '2008',
    'Visual Studio 2008',
    (solution_version = '10.00'),
    (project_version = '9.00'),
    (flat_sln = False),
    (uses_vcxproj = False),
    (path = path),
    (sdk_based = sdk_based)
  ),
  '2008e': VisualStudioVersion(
    '2008e',
    'Visual Studio 2008',
    (solution_version = '10.00'),
    (project_version = '9.00'),
    (flat_sln = True),
    (uses_vcxproj = False),
    (path = path),
    (sdk_based = sdk_based)
  ),
  '2005': VisualStudioVersion(
    '2005',
    'Visual Studio 2005',
    (solution_version = '9.00'),
    (project_version = '8.00'),
    (flat_sln = False),
    (uses_vcxproj = False),
    (path = path),
    (sdk_based = sdk_based)
  ),
  '2005e': VisualStudioVersion(
    '2005e',
    'Visual Studio 2005',
    (solution_version = '9.00'),
    (project_version = '8.00'),
    (flat_sln = True),
    (uses_vcxproj = False),
    (path = path),
    (sdk_based = sdk_based)
  )
};

参考:https://chromium.googlesource.com/external/gyp/+/master/pylib/gyp/MSVSVersion.py#259

jQuery Trickshots来自Tutorialzine的一本关于100个高级jQuery技术书籍分享

最近看到一篇写的不错的文章,来自jQuery中的100个技巧.首先感谢作者辛苦翻译.

不过我也想找原文…于是也是辛苦了很久才找到了这篇伟大的文章出处,更难能可贵的是该站竟然有多个版本的电子书,开放免费.当然是需要注册的,我注册了一个,下载了与大家分享.

这个压缩包包含了全部html,js实例源码,还有多个版本的电子版(pdf,mobi,epub),满足了用电脑,手机或者kindle的用户简直太棒了!!!迫不及待放出分享连接了.以下是分享地址

百度网盘: 英文原版下载页面(以及鸟语版,不懂鸟语的不要下)

如果不能下载了请与发邮件

最后再次感谢伟大的

作者:Tutorialzine

来源:http://tutorialzine.com/books/jquery-trickshots/

介绍:

In this book, you will find 100 advanced jQuery techniques that we have developed over the years as JavaScript programmers and authors for Tutorialzine, presented as easy to understand tips.

尼康单反摄影优化校准相关学习

那部Nikon D5000沉睡了太久了.因为年代已久,似乎我已不爱它了.曾经有一段时间,我每次带着D5000满怀希望的外出,希望能找到令人惊喜的照片,可是多少次带回来的是失望.可是后来我觉得这部单反还是很不错的.通过重新学习和认识D5000,来提高自己摄影水平,尼康单反摄影优化校准相关学习!

那部Nikon D5000沉睡了太久了.因为年代已久,似乎我已不爱它了.曾经有一段时间,我每次带着D5000满怀希望的外出,希望能找到令人惊喜的照片,可是多少次带回来的是失望.

于是渐渐地,我的手机开始取代它了.似乎快餐令人满意.生活节奏之快,让我忘记了初心,那些快感让我一直处于自我麻痹的快乐中.

前几日,我再次习惯性的带上了我的单反,和朋友们出游,他们也带了几部单反,闲暇之余,拿来朋友的Canon 600D,试玩了一把,同样是狗头,呈像效果完全不同…我试着将参数全部设置为一致.结果依然令我惊讶,我起初开始怀疑难道是因为这部用了6年的单反,要淘汰了吗.竟有买新机的冲动,是不是该换一步D7200了呢?

后来回来,翻了翻曾经的老照片,我仔细思考了一下,我否决了起初的想法.我认为我的D5000还能再战5年!!!(虽然有些夸张,但是大部分场景还是可以应付的).我真正该做的,大概是将它好好的保养一次,然后,重新阅读一次说明书.将各个参数的理解层次提高.我相信,这样一部老机器依然能拍出好的东西的.

接下来才是重点,学习研究过程中,离不开一些好的文章资料.这里也分享出来.

尼康优化校准设置杂谈2012新版
http://photo.withqiuliang.com/nikon_picture_control/index.html

尼康曲线(影像优化校准系统)详解 + 下载
http://bbs.rayi.cn/thread-261861-1-1.html

尼康优化校准曲线下载
http://www.ooidea.com/forum.php?mod=viewthread&tid=1617

尼康D5000使用技巧指南
http://jingyan.baidu.com/article/17bd8e52f954d585ab2bb8c0.html

Nikon D5000: tips for using your digital camera
http://www.digitalcameraworld.com/2012/09/08/nikon-d5000-tips-for-using-your-digital-camera/

Nikon D5000 Demo Review Tips 15 tricks – YouTube
https://www.youtube.com/watch?v=eRd6o9MyI50

好了先就这些了有空多读读.希望自己在未来一段时间能排出更好的作品~

[好歌推荐]On My Own – Samantha Barks爱潘妮

On My Own – Samantha Barks爱潘妮

还是离不开悲惨世界,故事中的爱潘妮扮演的人物形象,是那么无私而有伟大.出乎我的预料.故事发展到最后为喜欢的人而义无返顾的献身,虽然她知道马吕斯爱的并不是她,却毫无嫉妒与仇恨,如此精神让我感动不已.更难以想象的是那对恶心的旅店夫妇的孩子们却完全不一样的人生态度.

2013-10-20