課程
/前端開(kāi)發(fā)
/前端工具
/Vue+Webpack打造todo應(yīng)用
修改了app.vue的text;頁(yè)面不會(huì)自動(dòng)更新。完全按照代碼來(lái)寫(xiě)的。
2018-12-20
源自:Vue+Webpack打造todo應(yīng)用 2-3
正在回答
你們解決了嗎?
我也是這樣的
我也是這樣,你解決了嗎?
const path = require('path')
const HTMLPlugin = require('html-webpack-plugin')?
const webpack = require('webpack')
const isDev = process.env.NODE_ENV === 'development'
const config = module.exports = {
? ? target: 'web', //適用于web開(kāi)發(fā)
? ? entry: path.join(__dirname, 'src/index.js'),?
? ? output: {
? ? ? ? filename: 'bundle.js',
? ? ? ? path: path.join(__dirname, 'dist')
? ? },
? ? module: {
? ? ? ? rules: [{
? ? ? ? ? ? test: /\.vue$/,
? ? ? ? ? ? loader: 'vue-loader'
? ? ? ? }, {
? ? ? ? ? ? test: /\.css$/,
? ? ? ? ? ? use: [
? ? ? ? ? ? ? ? 'style-loader',
? ? ? ? ? ? ? ? 'css-loader'
? ? ? ? ? ? ]
? ? ? ? ? ? test: /\.styl$/,
? ? ? ? ? ? ? ? 'css-loader',
? ? ? ? ? ? ? ? 'stylus-loader'
? ? ? ? ? ? test: /\.(gif|jpg|jpeg|png|svg)$/,
? ? ? ? ? ? use: [{
? ? ? ? ? ? ? ? loader: 'url-loader',
? ? ? ? ? ? ? ? options: {
? ? ? ? ? ? ? ? ? ? limit: 1024,
? ? ? ? ? ? ? ? ? ? name: '[name].[ext]'
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }]
? ? ? ? }]
? ? plugins: [
? ? ? ? new webpack.DefinePlugin({
? ? ? ? ? ? 'process.env': {?
? ? ? ? ? ? ? ? NODE_ENV: isDev ? '"development"' : '"production"'
? ? ? ? ? ? }
? ? ? ? }),
? ? ? ? new HTMLPlugin()
? ? ]
}
if (isDev) {
? ? config.devtool = '#cheap-module-eval-source-map'
? ? config.devServer = {
? ? ? ? port: 8090,
? ? ? ? host: '0.0.0.0',?
? ? ? ? overlay: {
? ? ? ? ? ? errors: true?
? ? ? ? },
? ? ? ? inline: true,
? ? ? ? hot: true,?
? ? ? ? //historyFallback: {},
? ? ? ? open: true?
? ? }
? ? config.plugins.push(
? ? ? ? new webpack.HotModuleReplacementPlugin(),
? ? ? ? new webpack.NoEmitOnErrorsPlugin()
? ? )
module.exports = config
?
每次保存好之后,頁(yè)面出現(xiàn)以下代碼頁(yè)面要手動(dòng)刷新才會(huì)更改:
[WDS] App updated. Recompiling...
[WDS] App hot update...
舉報(bào)
用前端最熱門(mén)框架Vue+最火打包工具Webpack打造todo應(yīng)用
2 回答運(yùn)行頁(yè)面,app.vue頁(yè)面內(nèi)容不顯示
3 回答dev-server添加熱更新,整個(gè)頁(yè)面都刷新了
7 回答為什么我跟老師敲,設(shè)置hot為true以后 也加了 new webpack.HotModuleReplacementPlugin() 但是局部自動(dòng)刷新就是不成功。設(shè)置hot為false頁(yè)面能自動(dòng)刷新。
1 回答在app.vue文件內(nèi)錄入template的自動(dòng)補(bǔ)全的快捷鍵是什么
1 回答更新了extract-text-webpack-plugin版本后build依舊報(bào)錯(cuò)是怎么回事
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢(xún)優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2019-06-19
你們解決了嗎?
我也是這樣的
2018-12-23
我也是這樣,你解決了嗎?
2018-12-20
const path = require('path')
const HTMLPlugin = require('html-webpack-plugin')?
const webpack = require('webpack')
const isDev = process.env.NODE_ENV === 'development'
const config = module.exports = {
? ? target: 'web', //適用于web開(kāi)發(fā)
? ? entry: path.join(__dirname, 'src/index.js'),?
? ? output: {
? ? ? ? filename: 'bundle.js',
? ? ? ? path: path.join(__dirname, 'dist')
? ? },
? ? module: {
? ? ? ? rules: [{
? ? ? ? ? ? test: /\.vue$/,
? ? ? ? ? ? loader: 'vue-loader'
? ? ? ? }, {
? ? ? ? ? ? test: /\.css$/,
? ? ? ? ? ? use: [
? ? ? ? ? ? ? ? 'style-loader',
? ? ? ? ? ? ? ? 'css-loader'
? ? ? ? ? ? ]
? ? ? ? }, {
? ? ? ? ? ? test: /\.styl$/,
? ? ? ? ? ? use: [
? ? ? ? ? ? ? ? 'style-loader',
? ? ? ? ? ? ? ? 'css-loader',
? ? ? ? ? ? ? ? 'stylus-loader'
? ? ? ? ? ? ]
? ? ? ? }, {
? ? ? ? ? ? test: /\.(gif|jpg|jpeg|png|svg)$/,
? ? ? ? ? ? use: [{
? ? ? ? ? ? ? ? loader: 'url-loader',
? ? ? ? ? ? ? ? options: {
? ? ? ? ? ? ? ? ? ? limit: 1024,
? ? ? ? ? ? ? ? ? ? name: '[name].[ext]'
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }]
? ? ? ? }]
? ? },
? ? plugins: [
? ? ? ? new webpack.DefinePlugin({
? ? ? ? ? ? 'process.env': {?
? ? ? ? ? ? ? ? NODE_ENV: isDev ? '"development"' : '"production"'
? ? ? ? ? ? }
? ? ? ? }),
? ? ? ? new HTMLPlugin()
? ? ]
}
if (isDev) {
? ? config.devtool = '#cheap-module-eval-source-map'
? ? config.devServer = {
? ? ? ? port: 8090,
? ? ? ? host: '0.0.0.0',?
? ? ? ? overlay: {
? ? ? ? ? ? errors: true?
? ? ? ? },
? ? ? ? inline: true,
? ? ? ? hot: true,?
? ? ? ? //historyFallback: {},
? ? ? ? open: true?
? ? }
? ? config.plugins.push(
? ? ? ? new webpack.HotModuleReplacementPlugin(),
? ? ? ? new webpack.NoEmitOnErrorsPlugin()
? ? )
}
module.exports = config
?
每次保存好之后,頁(yè)面出現(xiàn)以下代碼頁(yè)面要手動(dòng)刷新才會(huì)更改:
[WDS] App updated. Recompiling...
[WDS] App hot update...