M
M
MaxA2019-06-29 11:43:48
Bootstrap
MaxA, 2019-06-29 11:43:48

How to connect bootstrap to pages in a hierarchy using webpack?

To organize the code, I took the settings https://github.com/dvlden/webpack-config
as a basis. I added lodash templates there and I'm trying to organize html in a hierarchy. The task is to decompose the pages of the site into folders.
Almost everything turned out, except that scripts and css are always connected with a fixed relative path:

<link href="styles/vendor.css" rel="stylesheet" integrity="sha384-4c9G+I/yq3IBxXf0lE7pXRk4t4kP1la8QlnGE4V8Yqz6GgiHmnEYRMY38DT6j/7D" crossorigin="anonymous">
<link href="styles/app.css" rel="stylesheet" integrity="sha384-hrN+yDAj6iev3YWrm0X4YOibtf+LEEpvUWDsgEqNnE3GsM+Jxqsz3fZ3XhN7Pvgl" crossorigin="anonymous">
<script src="scripts/vendor.js" integrity="sha384-vrpze4oBa0SwBD7dyfUKvpfrYramuy2JSxQHCeDaNaTjwHyboqK8v94V9tAv4xf9" crossorigin="anonymous"></script>
<script src="scripts/app.js" integrity="sha384-OTGhTqYvZUm0e2oaUF4gAUgPpRv0SR95cC0LsycsG+lKG5WFyqVKhW3QA0dEI137" crossorigin="anonymous"></script>

as a result, for files located in nested directories, the paths stop working.
Q: How should webpack be configured to include bootstrap with absolute paths instead of relative paths ? An example replay can be seen here: https://github.com/realMaxA/bootstrap-test
<script src="/scripts/vendor.js"></script>
<script src="scripts/vendor.js"></script>

Answer the question

In order to leave comments, you need to log in

1 answer(s)
M
MaxA, 2019-06-30
@realMaxA

I will answer myself: It is necessary to fill in the publicPath value in the output section:

output: {
  path: path.resolve(__dirname, 'dist'),
  publicPath: '/',
  filename: 'scripts/[name].js',
  crossOriginLoading: 'anonymous'
},

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question