Last active
April 13, 2021 02:41
-
-
Save joshrouwhorst/42c4f68f5fce4f8163a411da9d183dcb to your computer and use it in GitHub Desktop.
Webpack Error
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| node --trace-deprecation node_modules/webpack/bin/webpack | |
| (node:43540) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated. | |
| BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation. | |
| Do changes to assets earlier, e. g. in Compilation.hooks.processAssets. | |
| Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*. | |
| at /Users/joshrouwhorst/Documents/Projects/_Joshs/Test/node_modules/html-webpack-plugin/index.js:286:49 | |
| at processTicksAndRejections (internal/process/task_queues.js:93:5) | |
| asset assets/Image.png 2.61 MiB [emitted] [from: src/assets/Image.png] | |
| asset main.c74f277f0931dd2347b7.js 1.18 KiB [emitted] [immutable] (name: main) | |
| asset index.html 954 bytes [emitted] | |
| ./src/app.js 1 bytes [built] [code generated] | |
| ERROR in Error: /Users/joshrouwhorst/Documents/Projects/_Joshs/Test/src/template.html:121 | |
| /******/ __webpack_require__.b = require("url").pathToFileURL(__filename); | |
| ^ | |
| ReferenceError: __filename is not defined | |
| - template.html:121 | |
| /Users/joshrouwhorst/Documents/Projects/_Joshs/Test/src/template.html:121:65 | |
| - template.html:140 | |
| /Users/joshrouwhorst/Documents/Projects/_Joshs/Test/src/template.html:140:13 | |
| - template.html:150 | |
| /Users/joshrouwhorst/Documents/Projects/_Joshs/Test/src/template.html:150:12 | |
| - index.js:327 HtmlWebpackPlugin.evaluateCompilationResult | |
| [Test]/[html-webpack-plugin]/index.js:327:28 | |
| - index.js:243 | |
| [Test]/[html-webpack-plugin]/index.js:243:22 | |
| - task_queues.js:93 processTicksAndRejections | |
| internal/process/task_queues.js:93:5 | |
| - async Promise.all | |
| - async Promise.all |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "name": "test-project", | |
| "version": "1.0.0", | |
| "description": "", | |
| "main": "app.js", | |
| "scripts": { | |
| "pack:serve": "webpack serve", | |
| "pack:build": "webpack", | |
| "test": "echo \"Error: no test specified\" && exit 1" | |
| }, | |
| "author": "", | |
| "license": "ISC", | |
| "devDependencies": { | |
| "clean-webpack-plugin": "^4.0.0-alpha.0", | |
| "concurrently": "^6.0.0", | |
| "css-loader": "^5.2.1", | |
| "extract-loader": "^5.1.0", | |
| "fibers": "^5.0.0", | |
| "file-loader": "^6.2.0", | |
| "html-loader": "^2.1.2", | |
| "html-webpack-plugin": "^4.5.2", | |
| "live-server": "^1.2.1", | |
| "node-sass": "^5.0.0", | |
| "sass": "^1.32.8", | |
| "sass-loader": "^11.0.1", | |
| "style-loader": "^2.0.0", | |
| "webpack": "^5.31.2", | |
| "webpack-cli": "^4.6.0", | |
| "webpack-dev-server": "^3.11.2" | |
| }, | |
| "dependencies": { | |
| "@fortawesome/fontawesome-free": "^5.15.3", | |
| "bootstrap": "^5.0.0-beta3" | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Document</title> | |
| </head> | |
| <body> | |
| <img src="assets/Image.png" /> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const path = require('path') | |
| const { CleanWebpackPlugin } = require('clean-webpack-plugin') | |
| const HtmlWebpackPlugin = require('html-webpack-plugin') | |
| module.exports = { | |
| mode: 'development', | |
| entry: './src/app.js', | |
| output: { | |
| filename: '[name].[contenthash].js', | |
| path: path.resolve(__dirname, 'dist'), | |
| publicPath: 'assets', | |
| assetModuleFilename: 'assets/[name][ext][query]' | |
| }, | |
| devServer: { | |
| contentBase: path.join(__dirname, 'dist'), | |
| compress: true, | |
| port: 9000 | |
| }, | |
| plugins: [ | |
| new CleanWebpackPlugin(), | |
| new HtmlWebpackPlugin({ | |
| template: './src/template.html' | |
| }) | |
| ], | |
| module: { | |
| rules: [ | |
| { | |
| test: /\.html$/i, | |
| loader: 'html-loader' | |
| }, | |
| { | |
| test: /\.s[ac]ss$/i, | |
| use: [ | |
| 'style-loader', | |
| { | |
| loader: 'css-loader', | |
| options: { | |
| sourceMap: true | |
| } | |
| }, | |
| { // Beware the situation when node-sass and sass were installed! By default the sass-loader prefers sass. In order to avoid this situation you can use the implementation option. | |
| loader: 'sass-loader', | |
| options: { | |
| sourceMap: true, | |
| implementation: require('sass'), | |
| additionalData: "$env: " + process.env.NODE_ENV + ";", | |
| } | |
| } | |
| ] | |
| }, | |
| { | |
| test: /\.png$/, | |
| type: 'asset/resource' | |
| }, | |
| { | |
| test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/, | |
| type: 'asset/resource' | |
| } | |
| ] | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment