在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ webpack編譯文件的疑問

webpack編譯文件的疑問

我新建了一個(gè)index.html如下:

<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="bundle.js"></script>
</body>
</html>

同時(shí)新建了一個(gè)entry.js入口文件如下:

document.write('hello world.')

然后執(zhí)行$ webpack entry.js bundle.js

clipboard.png

貌似成功了!

但是發(fā)現(xiàn)bundle.js中什么都沒有,瀏覽器中也沒東西,反而是生成了一個(gè)dist文件夾,里面有個(gè)mian.js
我修改index.html:

<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="dist/main.js"></script>
</body>
</html>

這時(shí)候?yàn)g覽器顯示hello world

疑問:
為什么沒有如我所愿的將entry.js代碼打包到bundle.js ?

回答
編輯回答
司令

clipboard.png
上面的信息告訴你找不到輸出的文件,應(yīng)該按照默認(rèn)的main.js給你輸出了

2017年11月19日 14:13
編輯回答
孤島

可以自行配置:

var path = require('path');
var htmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    devtool: 'eval-source-map',
    entry: './entry.js',
    // ----------------------- 請(qǐng)關(guān)注這里 -----------------------
    output: {
        path: './dist',
        filename: 'bundle.min.js',
    },
    devServer: {
        port: 8000,
        inline: true,
        contentBase: './src'
    },
    module: {
        loaders: [
            {
                test: /\.less$/,
                loader: 'style!css!less'
            },
            {
                test: /\.js$/,
                loader: 'babel',
                exclude: /node_modules/
            },
            {
                test: /\.(jpg|png|svg)$/,
                loader: 'url'
            }
        ]
    },
    plugins: [
        new htmlWebpackPlugin({
            template: './src/index.html'
        })
    ]
};
2018年9月6日 09:38
編輯回答
夕顏
$ webpack entry.js bundle.js

這句話的意思的 將入口文件 entry編譯成bundle,并且引用到index.html執(zhí)行
具體編譯的過程,需要看你的webpage的配置信息
你方便的話,把你的webpage.config.js的代碼提交下

2018年6月8日 18:33