refactor: error and warning message

Author: cap-Bernardito

src/Error.js

@@ -1,3 +1,4 @@
+import path from 'path';
 /**
  * **PostCSS Syntax Error**
  *
@@ -9,7 +10,7 @@
  * @param {Object} err CssSyntaxError
  */
 class SyntaxError extends Error {
-  constructor(error) {
+  constructor(error, rootContext) {
     super(error);
 
     const { line, column, reason, plugin, file } = error;
@@ -23,8 +24,10 @@ class SyntaxError extends Error {
     }
 
     this.message += plugin ? `${plugin}: ` : '';
-    this.message += file || '<css input>';
-    this.message += ` ${reason}`;
+    this.message += file
+      ? `${path.relative(rootContext, file)} `
+      : '<css input> ';
+    this.message += `${reason}`;
 
     const code = error.showSourceCode();
 

src/index.js

@@ -108,7 +108,7 @@ export default async function loader(content, sourceMap, meta) {
     }
 
     if (error.name === 'CssSyntaxError') {
-      callback(new SyntaxError(error));
+      callback(new SyntaxError(error, this.rootContext));
     } else {
       callback(error);
     }

test/__snapshots__/loader.test.js.snap

@@ -162,7 +162,7 @@ Array [
   "ModuleBuildError: Module build failed (from \`replaced original path\`):
 SyntaxError
 
-(1:3) /test/fixtures/css/style.css Unnecessary curly bracket
+(1:3) css/style.css Unnecessary curly bracket
 
 > 1 | a {
     |   ^