简体   繁体   中英

how to hide website assets such as js and css files?

I came across the following index.html page in which i didn't find any custom assets, such as js and css files. The assets path is as follows

在此处输入图片说明

I am not able to find where we have included assets/css/custom/.css assets/js/custom/.js files.

Is there a way to hide these css and js file from html code?

<!DOCTYPE html>
<html ng-app="App">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Where passion meets potential</title>
</head>

    <body>
        <!-- start of loading jquery -->
        <script src="assets/js/vendor/jquery/jquery.min.js"></script>
        <script src="assets/js/vendor/lazyload/lazyload.js"></script>
        <!-- Loading angular and angular route via CDN -->
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
        <script src="//cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
        <script src="//cdn.firebase.com/libs/angularfire/1.2.0/angularfire.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/ngStorage/0.3.6/ngStorage.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.min.js"></script>

        <!-- Loading Angular Controller -->
        <script src="controller.js"></script>

        <!-- using lazyload to load our dependencies programatically -->
        <script src="assets/js/vendor/lazyload/application-css.js"></script>
        <script src="assets/js/vendor/lazyload/application-js.js"></script>

        <!-- Main Content -->
        <div id="main">
            <!-- angular template injection-->
            <div ng-view></div>
        </div>
        <!-- END Content -->

    </body>
</html>

Just read the comments. A library called lazyload is used to load all dependencies, probably from the folders you named.

<!-- using lazyload to load our dependencies programatically -->
<script src="assets/js/vendor/lazyload/application-css.js"></script>
<script src="assets/js/vendor/lazyload/application-js.js"></script>

I don't know how it works exactly but I assume it will add the lazily loaded files somewhere to the DOM. The client will always be able to find those resources somehow (eg the network tab of chrome devtools). The files in the code above will probably contain information about how it works for your project.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM