02 - webpack: output

/**    output告知 webpack 如何向硬盘写入编译文件，最少有一个 filenname 属性，告知webpack输出文件的名称，且只能有一个 output 配置
    1.output 常用对象属性：
        filename: 输出文件的名称，可以使用占位符来确保每个文件的名称唯一
        path: 输出文件的位置（路径），output.path 中的 URL 以 HTML 页面为基准
        publicPath: 引用资源（静态资源：图片、视频、文件、本地js库，或者远程资源：远程库、CDN）相对于HTML页面的路径
                    服务器也会默认从 publicPath 为基准，使用它来决定在哪个目录下启用服务，来访问 webpack 输出的文件
                    output: {
                        // One of the below
                        publicPath: 'auto', // 从`import.meta.url`, `document.currentScript`, `<script />` 或者 `self.location` 中的路径自动识别
                        publicPath: 'https://cdn.example.com/assets/', // CDN（总是 HTTPS 协议）
                        publicPath: '//cdn.example.com/assets/', // CDN（协议相同）
                        publicPath: '/assets/', // 相对于服务(server-relative)
                        publicPath: 'assets/', // 相对于 HTML 页面
                        publicPath: '../assets/', // 相对于 HTML 页面
                        publicPath: '', // 相对于 HTML 页面（目录相同）
                    }
    2.常用案例：
        1.多入口起点使用占位符
        module.export = {
            entry: {
                app: './src/app.js',
                search: './src/search.js',
            },
            output: {
                filename: '[name].js',
                path: __dirname + '/dist',
            }
        }
        2.使用CDN和hash
        output: {
            path: '/home/proj/cdn/assets/[fullhash]',
            publicPath: 'https://cdn.example.com/assets/[fullhash]/',
        }
    3.要点：
        不知道最终输出文件的 publicPath 是什么地址，则可以将其留空，并且在运行时通过入口起点文件中的 __webpack_public_path__ 动态设置。
        __webpack_public_path__ = myRuntimePublicPath;
        
    
        
**/

// 实例：
module.export = {
    output: {
        filename: 'bundle.js',
    }
}