View Source Loader

A webpack loader to view output in your project

Install

  npm i --save-dev view-source-loader

  yarn add --dev view-source-loader

Usage

webpack.config.js

You can config view-source-loader before any loader. For example, you now config before babel-loader, After you build with webpack, you will find a file named view-source-loader.txt in your project, it can view the result that your code compiled with ts-loader and babel-loader, it can help you in the development environment

module.exports = {
  entry: {
    index: path.resolve(__dirname, "./src/index.tsx"),
  },
  output: {
    path: path.resolve(__dirname, "./dist"),
    filename: "[name].[contenthash:8].js",
  },
  module: {
    rules: [
      {
        test: /\.(j|t)s(x)?$/,
        include: [path.resolve(__dirname, "src")],
        use: ["view-source-loader", "babel-loader", "ts-loader"],
      },
    ],
  },
};