Relative Path for Angular Font Files 4

Navigation
0

After creating a standard Angular application with ng new aplicacao and inserted into the PrimeNG, Bootstrap, Fontawesome libraries the application normally runs through ng server .

After running ng build and uploading the application to the server everything works as long as the application runs from the root of the domain (eg www.abc.com.br). If the application runs from a folder (ex: www.abc.com.br/appteste) and made the settings in the .js paths, the application normally loads but the files referring to the sources (.woff, .woff2, .ttf, .svg, .eot) are being searched at the root of the domain with this presenting error 404.

That is, the paths of the files mentioned above do not relate to the folder that the application is running. As everything is "joined" by Webpack I do not know where to change to change the path of the files mentioned above.

Does anyone know how to fix it? Thank you in advance for all your help.

    
asked by anonymous 27.07.2017 / 23:28

2 answers

0

When you create a project with ng cli, in the project root a file is created: .angular-cli.json Within this file you have the tag styles e scripts . So you just need to add the broker paths in this file, for example: 

"styles": [
    "../node_modules/roboto-fontface/css/roboto/sass/roboto-fontface.scss",
    "../node_modules/normalize.css/normalize.css",
    "../node_modules/font-awesome/scss/font-awesome.scss",
    "../node_modules/ionicons/scss/ionicons.scss",
    "../node_modules/bootstrap/scss/bootstrap.scss",
    "../node_modules/leaflet/dist/leaflet.css",
    "../node_modules/chartist/dist/chartist.css",
    "../node_modules/fullcalendar/dist/fullcalendar.css",
    "../node_modules/handsontable/dist/handsontable.full.css",
    "../node_modules/ng2-slim-loading-bar/style.css",
    "../node_modules/angular2-toaster/toaster.css",        
    "app/theme/theme.scss",
    "styles.scss"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/easy-pie-chart/dist/jquery.easypiechart.js",
    "../node_modules/jquery-slimscroll/jquery.slimscroll.js",
    "../node_modules/tether/dist/js/tether.js",
    "../node_modules/bootstrap/dist/js/bootstrap.js",
    "../node_modules/handsontable/dist/handsontable.full.js",
    "../node_modules/chroma-js/chroma.js"
  ],
    
28.07.2017 / 00:45
0

Hello, the solution to the specific case is to define the deploy-url in the ng build command: 

ng build --prod --deploy-url=/apptest/ --env=dev
    
18.08.2017 / 05:32
IPv6 are vulnerable to DDoS attacks? execute .Jar with administrative privileges (strange errors)