Here is my situation :
- Web site powered by Angular 4
- Initialised with Angular Starter Kit
- Using Semantic UI as CSS framework
Here is my issue :
Adding Semantic UI to webpack has no effect.
Here is what I tried :
(I followed the official Angular documentation for webpack)
Add semantic-ui to package.json
from terminal
npm install semantic-ui-css --save
Add vendor bundle to the entry property in webpack.common.js
[...]
entry: {
'polyfills': './src/polyfills.browser.ts',
'main': AOT ? './src/main.browser.aot.ts' :
'./src/main.browser.ts',
'vendor': './src/vendor.ts'
},
[...]
Create the src/vendor.ts
file and set its content to :
// Angular
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';
// My CSS framework
import 'semantic-ui-css';
What I got :
Webpack build without error, the vendor bundle is created :vendor.bundle.js 3.74 MB 2 [emitted] [big] vendor
And webpack inject the bundle script in the HTML page :
<script type="text/javascript" src="polyfills.bundle.js"></script><script type="text/javascript" src="vendor.bundle.js"></script><script type="text/javascript" src="main.bundle.js" async></script></body>
But the visual doesn't change (but should I check it with CDN) and I don't see the vendor.bundle.js
file in the dist
folder.
I probably miss something, what is it ?