vue 不会热启动_vue+webpack 热启动 wabpackconfig配置

var path = require('path')

var webpack = require('webpack')

// var VueVideoPlayer = require('vue-video-player')

//IP地址

var IPAddress = getIPAdress();

var serverHost = IPAddress;

module.exports = {

entry: './src/main.js',//值可以是字符串、数组或对象

output: {

path: path.resolve(__dirname, './dist'),//Webpack结果存储

publicPath: '/dist/',//懵懂,懵逼,//然而“publicPath”项则被许多Webpack的插件用于在生产模式和开发模式下下更新内嵌到css、html,img文件里的url值

filename: 'build.js'

},

module: {

rules: [

{

test: /.vue$/,

loader: 'vue-loader',

options: {

loaders: {}

// other vue-loader options go here

}

},

{

test: /\.js$/,

loader: 'babel-loader',

exclude: /node_modules/

},

{

test: /\.(png|jpg|gif|svg)$/,

loader: 'file-loader',

options: {

name: '[name].[ext]?[hash]'

}

}

//自己加的

,

{

test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,

loader: 'file-loader'

},

{

test: /\.css$/,

loader: "style-loader!css-loader"

}

,

{

test: /\.(scss|sass)$/,

loader: "style-loader!css-loader!sass-loader"

}

// {

// test: /\.(scss|sass)$/,

// loader: "style-loader!css-loader!sass-loader!sass!scss-loader!vue-style-loader"

// }

// },

// {

// test: /\.scss$/,

// loader: 'style!css!sass'

// }

// {

// test: /\.scss$/,

// loader: ExtractTextPlugin.extract('style', 'css!sass')

// }

// {

// test: /\.scss$/,

// loader: 'style!css!ruby-sass?compass=1'

// }

]

},

//使用webpack-dev-server

devServer: {

contentBase: path.join(__dirname, "/"),

host: serverHost,

port: 9090, //默认9090

inline: true, //可以监控js变化

hot: true//热启动

},

resolve: {

alias: {

vue: 'vue/dist/vue.js',

'jquery': 'jquery'

},

extensions: ['.js', '.scss', '.vue', '.json']// 可以不加后缀, 直接使用 import xx from 'xx' 的语法

},

resolveLoader: {

alias: {

'scss-loader': 'sass-loader',

},

}

}

if (process.env.NODE_ENV === 'production') {

module.exports.devtool = '#source-map'

// http://vue-loader.vuejs.org/en/workflow/production.html

module.exports.plugins = (module.exports.plugins || []).concat([

new webpack.ProvidePlugin({

jQuery: "jquery",

$: "jquery"

}),

new webpack.DefinePlugin({

'process.env': {

NODE_ENV: '"production"'

},

}),

new webpack.optimize.UglifyJsPlugin({

sourceMap: true,

compress: {

warnings: false

}

}),

new webpack.LoaderOptionsPlugin({

minimize: true

})

])

}

function getIPAdress() {

var interfaces = require('os').networkInterfaces();

for (var devName in interfaces) {

var iface = interfaces[devName];

for (var i = 0; i < iface.length; i++) {

var alias = iface[i];

if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {

return alias.address;

}

}

}

}

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值