3 Webpack 输出

输出(output)

指定输出打包的文件信息

 

用法

Filename：输出文件的文件名。

Path：输出文件目录的绝对路径。

webpack.config.js

const config = {

  output: {

    filename: 'bundle.js',

    path: '/home/proj/public/assets'

  }

};

 

module.exports = config;

此配置将文件打包为 bundle.js 文件并输出到 /home/proj/public/assets 目录中。

 

多个入口

如果配置了多个入口，则应该使用占位符(substitutions)来确保每个打包文件具有唯一的名称。

{

  entry: {

    app: './src/app.js',

    search: './src/search.js'

  },

  output: {

    filename: '[name].js',

    path: __dirname + '/dist'

  }}

[name]：是一个占位符，表示入口的名称

__dirname：是一个nodejs的全局变量，其值为webpack.config.js所在目录

该配置生成2个打包文，./dist/app.js, ./dist/search.js

 

高级进阶

output: {

        path: __dirname + "/build/js",

        publicPath: "/js",

        filename: "[name].bundle.js"

},

path：为输出js文件的本地路径

publicPath：为输出js文件的url路径

如上的输出url路径为  /js/****.js