fix: fix handle assets repetitively error

Change-Id: Ie8e19cd626ea71ae6769e0a1e44799b622bc3359

Author: dongxu.shelton

README.md

@@ -26,6 +26,7 @@ module.exports = {
           loader: 'postcss-loader',
           options: {
             plugins: [
+              // other plugins ...
               require('postcss-file')({
                 url: 'copy',
                 assetsPath: 'dist/assets',
@@ -53,6 +54,7 @@ const config = {
     postcss({
       // ...
       plugins: [
+        // other plugins ...
         require('postcss-file')({
           url: 'copy',
           assetsPath: 'dist/assets',
@@ -66,7 +68,7 @@ const config = {
 
 export default config;
 ```
-#### Note: You must use options to specify how would you like to handle your assets in your css, if you don't pass any options, PostCSS File will do nothing about your assets.
+#### Note: You must use options to specify how would you like to handle your assets in your css, if you don't pass any options, PostCSS File will do nothing about your assets. Additionally, for the full effects for your assets, please put PostCSS File plugin on the lastest of postcss plugins.
 
 # Url Resolve
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss-file",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "PostCSS plugin for handle assets",
   "main": "dist/index.js",
   "keywords": [

src/index.ts

@@ -4,15 +4,55 @@ import { shouldHandle } from './utils/filters';
 import { handleAsset } from './utils/urlHandler';
 import { validateOptions } from './utils/validators';
 
+// Url type
 export type URL = 'copy' | 'inline';
 
-export interface PostcssFileOptions {
+/**
+ * PostCSS File plugin options
+ *
+ * @property extensions
+ * @property include
+ * @property exclude
+ * @property url
+ * @property assetsPath
+ * @property publicPath
+ * @property hash
+ */
+export interface PostcssFileOptions extends Object {
+	/**
+   * @default undefined
+   * @description determines which type of files should be handle
+   */
 	extensions?: string[];
+	/**
+   * @default undefined
+   * @description determines where to search for assets
+   */
 	include?: string[];
+	/**
+   * @default undefined
+   * @description determines which folder should be exclided
+   */
 	exclude?: string[];
+	/**
+   * @default "inline"
+   * @description determines how to handle the url, "copy" or "inline". require assetsPath | "inline"
+   */
 	url?: URL;
+	/**
+   * @default undefined
+   * @description where the assets should be copy to.
+   */
 	assetsPath?: string;
+	/**
+   * @default undefined
+   * @description the prefix of output url
+   */
 	publicPath?: string;
+	/**
+   * @default false
+   * @description use hash to be the asset's name
+   */
 	hash?: boolean;
 }
 
@@ -26,7 +66,14 @@ export default postcss.plugin<PostcssFileOptions>('postcss-file', (options): Tra
 			};
 
 		return function(root) {
+
 			root.walkDecls(/(background|src)/, function(decl) {
+				// do nothing if this declaration is already have been handled
+				if ((decl as any).handled) {
+					return;
+				}
+				// set handled flag to fix the error, which would handle assets repetitively.
+				(decl as any).handled = true;
 				// test whether there is url value
 				if (!/url/.test(decl.value)) {
 					return;

src/utils/validators.ts

@@ -5,6 +5,12 @@ const warn = (message: string) => {
 	console.warn(chalk.bold.yellow(message));
 };
 
+/**
+ * Check the options, and throw error if it's invalid.
+ *
+ * @param options
+ * @throws Invalid options
+ */
 export const validateOptions = (options: PostcssFileOptions | undefined) => {
 	if (!options) {
 		return false;