4 Commits 68b9ea1ee6 ... 753b1247ef

Author SHA1 Message Date
  Volodymyr Tkach 753b1247ef Don't cache local files 1 year ago
  Volodymyr Tkach 49f0d18268 Update README.md 1 year ago
  Volodymyr Tkach 961815e4a8 Ability to include local files 1 year ago
  Volodymyr Tkach 4eaf3326ed Add test data 1 year ago
6 changed files with 35 additions and 7 deletions
  1. 4 1
      README.md
  2. 17 5
      assets.sh
  3. 3 0
      test/local/subdir/test3.css
  4. 3 0
      test/local/test2.css
  5. 1 1
      test/test.css
  6. 7 0
      test/test.dev.css

+ 4 - 1
README.md

@@ -29,12 +29,15 @@ assets.sh
 
 
 Keep your CSS and JS files with `*.dev.css` and `*.dev.js` suffix. Run `make assets` command to process all finded files starting recursively from your makefile (root project) directory
 Keep your CSS and JS files with `*.dev.css` and `*.dev.js` suffix. Run `make assets` command to process all finded files starting recursively from your makefile (root project) directory
 
 
-You can include CSS or JS files from internet into local file by `import()` command inside CSS or JS file. Check `/test/` directory and `/test/test.dev.css` file. For example:
+You can include CSS/JS local files or CSS/JS file from internet into local file by `import()` command inside CSS/JS file. Check `/test/` directory and `/test/test.dev.css` file. For example:
 
 
 ```css
 ```css
 /* import(https://path/to/file/reset.css) */
 /* import(https://path/to/file/reset.css) */
 /* import(https://path/to/file/controls/checkbox/ios.css) */
 /* import(https://path/to/file/controls/checkbox/ios.css) */
 
 
+/* import(./local-file.css) */
+/* import(./another/local-file.css) */
+
 .example {
 .example {
     background-color: red;
     background-color: red;
 }
 }

+ 17 - 5
assets.sh

@@ -49,11 +49,23 @@ while read -r line; do
 				CACHE_FILE="${CURRENT_DIR}/.cache/${CACHE_NAME}"
 				CACHE_FILE="${CURRENT_DIR}/.cache/${CACHE_NAME}"
 
 
 				DATA_TO_IMPORT=""
 				DATA_TO_IMPORT=""
-				if [[ ! -f "${CACHE_FILE}" ]]; then
-					DATA_TO_IMPORT=$(curl -s "${FILE_TO_IMPORT}")
-					echo "${DATA_TO_IMPORT}" > ${CACHE_FILE}
-				else
-					DATA_TO_IMPORT=$(cat ${CACHE_FILE})
+
+				# Local import
+				if [[ ${FILE_TO_IMPORT} == "./"* ]]; then
+					FILE_TO_IMPORT="$(dirname "${SOURCE_FILE}")$(echo "${FILE_TO_IMPORT}" | sed 's/^\.//')"
+					if [[ -f "${FILE_TO_IMPORT}" ]]; then
+						DATA_TO_IMPORT=$(cat "${FILE_TO_IMPORT}")
+					fi
+				fi
+
+				# Remote import
+				if [[ ${FILE_TO_IMPORT} == "http"* ]]; then
+					if [[ ! -f "${CACHE_FILE}" ]]; then
+						DATA_TO_IMPORT=$(curl -s "${FILE_TO_IMPORT}")
+						echo "${DATA_TO_IMPORT}" > ${CACHE_FILE}
+					else
+						DATA_TO_IMPORT=$(cat ${CACHE_FILE})
+					fi
 				fi
 				fi
 
 
 				echo "${DATA_TO_IMPORT}" >> ${TARGET_FILE}
 				echo "${DATA_TO_IMPORT}" >> ${TARGET_FILE}

+ 3 - 0
test/local/subdir/test3.css

@@ -0,0 +1,3 @@
+.subdir {
+    background-color: purple;
+}

+ 3 - 0
test/local/test2.css

@@ -0,0 +1,3 @@
+.local {
+    background-color: green;
+}

+ 1 - 1
test/test.css

@@ -1 +1 @@
-*,::after,::before{box-sizing:border-box}html{height:100%;line-height:1.5}body{color:#212529;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;margin:0;padding:0}.clear::after{clear:both;content:'';display:block;height:0;line-height:0;margin:0;padding:0}.checkbox-ios{display:inline-block;height:20px;vertical-align:middle;width:35px}.checkbox-ios input[type=checkbox]{max-height:0;max-width:0;opacity:0;position:absolute}.checkbox-ios input[type=checkbox]+label{border-radius:24px;border:2px solid #212529;cursor:pointer;display:block;height:20px;margin-bottom:0;margin-top:0;position:relative;text-indent:-5000px;width:35px}.checkbox-ios input[type=checkbox]+label:before{background:#212529;border-radius:24px;content:"";display:block;height:12px;left:2px;position:absolute;top:2px;transition:.1s ease-in-out;width:12px}.checkbox-ios input[type=checkbox]:checked+label{border-color:#212529}.checkbox-ios input[type=checkbox]:focus+label{box-shadow:0 0 0 .25rem rgb(13 110 253 / 25%);outline:0}.checkbox-ios input[type=checkbox]:checked+label:before{background:#212529;left:17px}.checkbox-ios input[type=checkbox]+label:after{border-color:#212529;border-style:solid;border-width:0 0 2px 2px;content:"";display:block;height:5px;left:6px;opacity:0;position:absolute;top:7px;transform:translate3d(-50%,-50%,0) rotate(-45deg);transition:.1s ease-in-out;width:7px}.checkbox-ios input[type=checkbox]:checked+label:after{border-color:#212529;opacity:1}.example{background-color:red}
+*,::after,::before{box-sizing:border-box}html{height:100%;line-height:1.5}body{color:#212529;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;margin:0;padding:0}.clear::after{clear:both;content:'';display:block;height:0;line-height:0;margin:0;padding:0}.checkbox-ios{display:inline-block;height:20px;vertical-align:middle;width:35px}.checkbox-ios input[type=checkbox]{max-height:0;max-width:0;opacity:0;position:absolute}.checkbox-ios input[type=checkbox]+label{border-radius:24px;border:2px solid #212529;cursor:pointer;display:block;height:20px;margin-bottom:0;margin-top:0;position:relative;text-indent:-5000px;width:35px}.checkbox-ios input[type=checkbox]+label:before{background:#212529;border-radius:24px;content:"";display:block;height:12px;left:2px;position:absolute;top:2px;transition:.1s ease-in-out;width:12px}.checkbox-ios input[type=checkbox]:checked+label{border-color:#212529}.checkbox-ios input[type=checkbox]:focus+label{box-shadow:0 0 0 .25rem rgb(13 110 253 / 25%);outline:0}.checkbox-ios input[type=checkbox]:checked+label:before{background:#212529;left:17px}.checkbox-ios input[type=checkbox]+label:after{border-color:#212529;border-style:solid;border-width:0 0 2px 2px;content:"";display:block;height:5px;left:6px;opacity:0;position:absolute;top:7px;transform:translate3d(-50%,-50%,0) rotate(-45deg);transition:.1s ease-in-out;width:7px}.checkbox-ios input[type=checkbox]:checked+label:after{border-color:#212529;opacity:1}.example{background-color:red}.local{background-color:green}.subdir{background-color:purple}.example2{background-color:yellow}

+ 7 - 0
test/test.dev.css

@@ -4,3 +4,10 @@
 .example {
 .example {
     background-color: red;
     background-color: red;
 }
 }
+
+/* import(./local/test2.css) */
+/* import(./local/subdir/test3.css) */
+
+.example2 {
+    background-color: yellow;
+}