Add publish setup for plain svg icons in NPM (#160)

* Initial proof of publishing raw svg files in npm

* Added new package to publish svg-icons module

* Undo some original importer package changes.

* Renamed and made fill replacement work on Windows

* Fixed fill replace
Fixed selector generation for Android
Updated version and sequence for svg publishing

* Revert

* Fixed build error from missing dist directory
Organized package file

* Resolved comments
Added readme

* Finish package rename

Co-authored-by: Brian Heston <[email protected]>

.github/workflows/pr.yml

@@ -111,3 +111,25 @@ jobs:
         dryRunOnly: true
         accessToken: "placeholder"
         refreshToken: "placeholder"
+
+  build-svg:
+    name: Build svg library
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v2
+
+    - name: Use Node 11
+      uses: actions/setup-node@v1
+      with:
+        node-version: 11.x
+
+    - run: npm install
+      working-directory: importer
+
+    - run: npm install
+      working-directory: packages/svg-icons
+
+    - name: Run build
+      run: npm run build
+      working-directory: packages/svg-icons

.github/workflows/publish.yml

@@ -10,7 +10,7 @@ env:
 jobs:
   publish-library:
     if: "!contains(github.event.head_commit.author.email, '[email protected]')"
-    name: Publish mobile libraries
+    name: Publish icon libraries
     runs-on: ubuntu-latest
 
     steps:
@@ -107,6 +107,12 @@ jobs:
         sed -i.bk -r "s/version: [0-9]+\.[0-9]+\.[0-9]+/version: $NEW_VERSION/g" flutter/pubspec.yaml
         rm flutter/pubspec.yaml.bk
 
+    # Needs to be "-E" instead of "-r" on macOS
+    - name: Replace version number in svg-icons/package.json
+      run: |
+        sed -i.bk -r "s/\"version\": \"[0-9]+\.[0-9]+\.[0-9]+\"/\"version\": \"$NEW_VERSION\"/g" packages/svg-icons/package.json
+        rm packages/svg-icons/package.json.bk
+
     # Needs to be "-E" instead of "-r" on macOS
     - name: Replace version number in _manifest.json
       run: |
@@ -119,6 +125,15 @@ jobs:
         sed -i.bk -r "s/[0-9][0-9][0-9][0-9]-[0-9][0-9]-[0-9][0-9]T[0-9][0-9]:[0-9][0-9]Z/$(date -u +%Y-%m-%dT%RZ)/" _iconCloud/manifest.json
         rm _iconCloud/manifest.json.bk
 
+    ## Publish svg icons
+    - name: Run svg publish
+      run: npm publish
+      working-directory: packages/svg-icons
+      env:
+        NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+      with:
+        registry-url: https://registry.npmjs.org
+
     - name: Update icon sheet
       run: python3 generate_icons_md.py
 

.gitignore

@@ -3,8 +3,8 @@ npm-debug.log
 *.sublime-workspace
 tmp
 dev_tests/automatic/screenshots
-importer/dist/*
-!importer/dist/.keep
+dist/
+!dist/.keep
 *.DS_Store
 
 .project
@@ -17,3 +17,5 @@ importer/dist/*
 
 xcuserdata
 /ios/FluentIcons/Tests
+
+/packages/svg-icons/icons

README.md

@@ -55,6 +55,10 @@ dependencies:
 
 For library docs, see [flutter/README.md](flutter/README.md)
 
+### Plain svg
+
+Inline svg directly. See [packages\svg-icons\README.md](packages\svg-icons\README.md).
+
 ## Contributing
 
 ### Importer

importer/generate.js

@@ -4,13 +4,14 @@
 const fs = require("fs");
 const path = require("path");
 const process = require("process");
-const argv = require("yargs").argv;
+const argv = require("yargs").boolean("selector").default("selector", false).argv;
 const _ = require("lodash");
 
 const SRC_PATH = argv.source;
 const DEST_PATH = argv.dest;
 const EXTENSION = argv.extension;
 const TARGET = argv.target;
+const SELECTOR = argv.selector;
 const ICON_OUTLINE_STYLE = '_regular'
 const ICON_FILLED_STYLE = '_filled'
 const ICON_LIGHT_STYLE = '_light'
@@ -36,6 +37,10 @@ if (!EXTENSION) {
   throw new Error("Desired icon extension not specified by --extension");
 }
 
+if (!fs.existsSync(DEST_PATH)) {
+  fs.mkdirSync(DEST_PATH);
+}
+
 processFolder(SRC_PATH, DEST_PATH)
 
 function processFolder(srcPath, destPath) {
@@ -82,7 +87,7 @@ function processFolder(srcPath, destPath) {
         var destFile = path.join(destPath, file);
         fs.copyFileSync(srcFile, destFile);
         // Generate selector if both filled/regular styles are available
-        if (file.endsWith(SVG_EXTENSION)) {
+        if (SELECTOR && file.endsWith(SVG_EXTENSION)) {
           var index = file.lastIndexOf(ICON_OUTLINE_STYLE);
           if (index == -1) {
             index = file.lastIndexOf(ICON_FILLED_STYLE);