Build Semantic UI in Shared Folder with Gulp

I am setting up semantic frontend with Node.js using the guide at https://semantic-ui.com/introduction/getting-started.html .

So I first install Gulp ( npm install -g gulp

), then semantic UI ( npm install semantic-ui --save

) and finally build with

cd semantic/
gulp build

      

Now I am getting a folder /semantic/

in my project root.

The problem is I am using Express.js, so I have all my views in /views/

and my static files in /public/

.

When I build with Gulp, I am getting js and css files in /semantic/dist/

, so I cannot access them on the client.

What can I do is use

app.use(express.static(path.join(__dirname, 'semantic')));

      

and then refer to css and js files with

<link href="/dist/semantic.css">

      

and

<script src="/dist/semantic.js">

      

but I would prefer that these two files be located in /public/css/

and /public/js/

respectively.

Right now I just want to move two files from /semantic/dist/

two folders to /public/

, but in https://semantic-ui.com/introduction/getting-started.html , it is recommended to use

<link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css">
<script
  src="https://code.jquery.com/jquery-3.1.1.min.js"
  integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
  crossorigin="anonymous"></script>
<script src="semantic/dist/semantic.min.js"></script>

      

but since /semantic/

it is not added as a static folder in Express.js, I cannot access this folder from the client.

My file semantic.json

looks like

{
  "base": "semantic/",
  "paths": {
    "source": {
      "config": "src/theme.config",
      "definitions": "src/definitions/",
      "site": "src/site/",
      "themes": "src/themes/"
    },
    "output": {
      "packaged": "dist/",
      "uncompressed": "dist/components/",
      "compressed": "dist/components/",
      "themes": "dist/themes/"
    },
    "clean": "dist/"
  },
  "permission": false,
  "autoInstall": true,
  "rtl": false,
  "version": "2.2.9"
}

      

Is it safe to say that js files should go to /public/js/

and css files in /public/css/

in this config file?

+3


source to share





All Articles