admin lte 3

application.js

import 'bootstrap';
import 'admin-lte/build/js/AdminLTE';

application.scss

@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700");

$fa-font-path: "../../node_modules/@fortawesome/fontawesome-free/webfonts";

@import "~@fortawesome/fontawesome-free/scss/fontawesome";
@import "~@fortawesome/fontawesome-free/scss/solid";
@import "~@fortawesome/fontawesome-free/scss/brands";

@import "~admin-lte/build/scss/AdminLTE";

package.json

{
	"name": "webpack-go",
	"version": "1.0.0",
	"main": "index.js",
	"license": "MIT",
	"scripts": {
		"test": "echo \"Error: no test specified\" && exit 1",
		"start:dev": "webpack-dev-server",
		"build": "webpack"
	},
	"dependencies": {
		"@fortawesome/fontawesome-free": "^5.12.1",
		"admin-lte": "^3.0.2",
		"clean-webpack-plugin": "^3.0.0",
		"copy-webpack-plugin": "^5.1.1",
		"css-loader": "^3.4.2",
		"file-loader": "^5.0.2",
		"html-webpack-plugin": "^3.2.0",
		"mini-css-extract-plugin": "^0.9.0",
		"node-sass": "^4.13.1",
		"postcss-loader": "^3.0.0",
		"sass-loader": "^8.0.2",
		"style-loader": "^1.1.3",
		"uglifyjs-webpack-plugin": "^2.2.0",
		"webpack": "^4.41.5",
		"webpack-cli": "^3.3.10",
		"webpack-dev-server": "^3.10.3",
		"webpack-manifest-plugin": "^2.2.0"
	}
}

webpack.config.js

const path = require('path');
const webpack = require('webpack');
const {CleanWebpackPlugin} = require('clean-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');
const CopyPlugin = require('copy-webpack-plugin');

module.exports = {
	mode: 'development',
	entry: {
		application: [
			'./assets/js/application.js',
			'./assets/css/application.scss',
		],
	},
	output: {
		path: path.resolve(__dirname, 'dist'),
		filename: 'js/[name].js'
	},
	module: {
		rules: [
			{
				test: /\.scss$/i,
				use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
			},
			{
				test: /\.(eot|woff|woff2|ttf|svg)(\?\S*)?$/,
				use: [{
					loader: 'file-loader',
					options: {
						name: '[name].[ext]',
						publicPath: '../fonts',
						outputPath: 'fonts/',
					}
				}]
			},
		],
	},
	plugins: [
		new CleanWebpackPlugin(),
		new CopyPlugin([
			{
				from: './assets/index.html',
			},
			{
				from: './assets/img',
				to: 'img',
			},
		]),
		new MiniCssExtractPlugin({
			filename: 'css/[name].css',
			chunkFilename: 'css/[id].css'
		}),
		new ManifestPlugin(),
		// new HtmlWebpackPlugin({
		// 	title: 'Output Management',
		// 	template: "./assets/index.html",
		// }),
		new webpack.ProvidePlugin({
			$: 'jquery',
			jQuery: 'jquery',
			'window.jQuery': 'jquery',
			Popper: ['popper.js', 'default']
		})
	],
	optimization: {
		minimizer: [new UglifyJsPlugin()],
	},
	devServer: {
		contentBase: path.join(__dirname, 'dist'),
		compress: true,
		port: 9000
	}
};