webpack

The provided value is not an absolute path!の原因と対処法

本記事では、Webpackの設定ファイルが原因で起きる「The provided value is not an absolute path!」の原因と対処法について解説しています。

ITエンジニア特化の転職サイト!
自社内開発求人に強い【クラウドリンク】

先輩くん
先輩くん
年収、休日数、労働環境等クラウドリンクが審査し、これらを通過した優良求人情報のみ紹介しているよ!
後輩ちゃん
後輩ちゃん
100%自社内開発の求人だから、SESのように職場環境が変わらないのがいいね!
簡単30秒で無料登録!

最短3ヶ月でエンジニアになれる!?
転職成功率98%のプログラミングスクール
DMM WEB CAMP

先輩くん
先輩くん
オンライン完結で24時間どこでも学習することができるよ!
後輩ちゃん
後輩ちゃん
未経験から憧れのエンジニアになるぞ〜!!
簡単30秒で無料相談申し込み

エラーの原因と対処法

このエラーが起きる原因は、絶対パスで設定すべき場所を相対パスで設定していることです。

例えば、webpack.config.jsファイルのoutput:{path:”パス”}は絶対パスで指定する必要があるため、下記のような設定でwebpackを実行すると同じエラーが返ってきます。

module.exports = {
  entry: "./src/index.js",
  output: {
    path: "./dist", // -> エラーの原因!!
    filename: "main.js",
  },
}

Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
- configuration.output.path: The provided value "./dist" is not an absolute path!
-> The output directory as **absolute path** (required).

これをエラーを返さないようにするためには、下記のように記述を変更します。

const path = require("path");

module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "./dist"), // -> 絶対パスで指定!!
    filename: "main.js",
  },
};

ブログランキング・にほんブログ村へ PVアクセスランキング にほんブログ村