原文链接: 点

如果不能自动打开浏览器,是因为没有安装插件。

插件安装的方法
1.安装插件,在cmd中输入:

$ npm i open-browser-webpack-plugin --save
这里的 i 表示 install ,是缩写。

2.修改build\webpack.dev.conf.js文件。
在顶部声明最下面加入:

var OpenBrowserPlugin = require('open-browser-webpack-plugin')
在plugins中加入:

new OpenBrowserPlugin({ url: 'http://localhost:8080' }),

var config = require('../config')
var webpack = require('webpack')
var merge = require('webpack-merge')
var utils = require('./utils')
var baseWebpackConfig = require('./webpack.base.conf')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var FriendlyErrors = require('friendly-errors-webpack-plugin')
var OpenBrowserPlugin = require('open-browser-webpack-plugin') // add hot-reload related code to entry chunks
Object.keys(baseWebpackConfig.entry).forEach(function (name) {
baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
}) module.exports = merge(baseWebpackConfig, {
module: {
loaders: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
},
// eval-source-map is faster for development
devtool: '#eval-source-map',
plugins: [
new OpenBrowserPlugin({ url: 'http://192.168.10.105:8080' }),
new webpack.DefinePlugin({
'process.env': config.dev.env
}),
// https://github.com/glenjamin/webpack-hot-middleware#installation--usage
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
// https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
}),
new FriendlyErrors()
]
})

3.最后,在运行npm run dev 即可。

vue无法自动打开浏览器的更多相关文章

  1. Vue方式自动打开浏览器配置

    Vue方式自动打开浏览器配置 1. 通过 package.json 配置项目 // 必须是符合规范的json语法 "vue": { "devServer": { ...

  2. vue中npm run dev运行项目不能自动打开浏览器! 以及 webstorm跑vue项目jshint一直提示错误问题的解决方法!

    vue中npm run dev运行项目不能自动打开浏览器!以及 webstorm跑vue项目jshint一直提示错误问题的解决方法! 1.上个项目结束就很久没有使用vue了,最近打算用vue搭建自己的 ...

  3. vue 使用 npm run dev命令后 自动打开浏览器

    1.使用vue-cli 老版本构建项目时, 可修改config文件夹下index.js文件 autoOpenBrowser 属性给为 true 即可 使用vue-cli 3.x 版本后,所有的配置项均 ...

  4. vue中npm run dev运行项目自动打开浏览器

    npm run dev运行项目自动打开浏览器设置自动打开浏览器 // 各种设备设置信息      host: 'localhost', //主机名      port: 8080, // 端口号(默认 ...

  5. vue中npm run dev 不能自动打开浏览器运行项目

    最近用vue2.0 + webpack搭建了环境创建新的项目.出现一个很蹩脚的问题: 在终端输入 npm run dev 的时候,不能自动打开浏览器运行项目. 这段话的意思是:你的应用程序运行地址是: ...

  6. webpack之带有可自动打开浏览器及热重载的基本配置

    什么是Webpack WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并 ...

  7. vue-cli2.9.1如何自动打开浏览器及实现手机调试

    在vue-cli2.9.1以前我们运行 "npm run dev" 程序会自动打开浏览器进行调试,而且在手机浏览器输入 "IP地址:8080" 能实现在手机端的 ...

  8. autoOpenBrowser: true, 运行npm后自动打开浏览器

    autoOpenBrowser: true, 运行npm后自动打开浏览器

  9. Jupyter Notebook不能自动打开浏览器

    安装了 Winpython,运行Jupyter Notebook.exe或Jupyter lab.exe,总是不能自动打开浏览器,提示"no web browser found" ...

随机推荐

  1. 使用mpvue开发小程序如何定义全局变量

    我们创建好mpvue项目之后,找到src/main.js打开在后面添加一行代码 (注意:不能在const app = new Vue(App) 之前添加) Vue.prototype.globalDa ...

  2. Python Requests-学习笔记(4)-定制请求头和POST

    定制请求头 如果你想为请求添加HTTP头部,只要简单地传递一个 dict 给 headers 参数就可以了. import jsonurl = 'https://api.github.com/some ...

  3. AJ学IOS(03)UI之纯代码实现UI——图片查看器

    AJ分享,必须精品 先看效果 主要实现类似看新闻的一个界面,不用拖拽,纯代码手工写. 首先分析app可以很容易知道他这里有两个UILabel一个UIImageView还有两个UIButton 定义UI ...

  4. 解决同层hover事件重叠闪烁问题

    完整代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  5. stand up meeting 12-10

    今天项目会议正好利用了大家上课前的十五分钟,大家对项目进度和项目中所遇到的问题进行了沟通. 由于天赋同学与重阳小组沟通及时有效,在mapping的过程中直接将单词本中的type与我们单词挑战中的que ...

  6. stand up meeting 11/17/2015

    今日工作总结: 冯晓云:代表组内参加了北航软工M1检查,有幸在工作展开之前先观摩别人的工作,吸取经验和教训:现在看来,当时对往届ASE学员的采访还不够深入,只说统筹分工团结合作还是有些空,具体的任务划 ...

  7. 哈密顿绕行世界问题 HDU2181

    题目大意都比较简单,用vector存一下图,然后爆搜就可以了. #include<bits/stdc++.h> using namespace std; ; vector<]; bo ...

  8. react-devtools安装调试

    初学react,Chrome F12调试,需要一款插件react-devtools. 网上大多对于翻墙不利索的同学大多才用了git源码.npm本地手动打包Chrome拓展程序.如:https://ww ...

  9. java 方法的重载、重写与重构

    首先我们要知道重载.重写.重构的区别 重载:指的是在同一个类中,方法名相同,但是参数数量.参数类型或者返回类型不同的方法就叫做重载. 重写: 重写分两种.第一种的是在子类继承父类的情况下,通过@Ove ...

  10. 使用dynamic和MEF实现轻量级的AOP组件 (2)

    转摘 https://www.cnblogs.com/niceWk/archive/2010/07/21/1782092.html 偷梁换柱 上一篇我们初试了DynamicAspect这把小刀,如果你 ...