0

So I recently used angular-seed in a code challenge as part of a job interview process. I got dinged for keeping bower_components inside the app folder.

Question 1: Is this really such a bad practice - to keep bower_components inside the app folder?

After getting dinged, I decided to install bower_components on the same level as the app folder. But of course, all the references in index.html no longer made sense since the references expected bower_components to be inside the app folder.

Question 2: How would I reference the bower_components outside the app folder? Would this need to be part of a build step to copy app to a ./public folder, then copy bower_compnents into ./public/app, then start the server and tell it to serve static files from ./public/app?

I modified the "prestart" command to accomplish this, but it just didn't feel right. And then there's also the issue of making changes in the app folder and then having to restart the server every time to see my changes in the browser.

What's the best practice here? I know the yeoman generator keeps bower_components outside the project root and a gulp/grunt task corrects the references, but I like angular-seed because it's pretty minimal and I'd like to just use npm for build tasks.

4

1 に答える 1

0

. _ bower_components_node_modules

どちらもパッケージマネージャーです。.bowerrcパスの設定に使用: ( docs )

{
  "directory": "public/app/js"
}

bower install設定したディレクトリに bower.json のすべてのファイルを配置します。

または、grunt を使用する場合は、yeoman generator-angular が grunt を使用して、bower スクリプト/css を縮小およびクリーンアップする方法を確認できます。

    <!-- build:js(.) scripts/vendor.js -->
    <!-- bower:js -->
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <!-- endbower -->
    <!-- endbuild -->

        <!-- build:js({.tmp,app}) scripts/scripts.js -->
        <script src="/scripts/app.js"></script>
        <script src="/controllers/main.js"></script>
        <!-- endbuild -->

Gruntfile.js は次のようになります。 (Gruntfile は を使用すると生成されますyo angular)

これを使用するgrunt buildと、index.html が連結され、すべてが dist フォルダーに複製され、スクリプトは次のようになります。

<script src="scripts/vendor.2bed74dc.js"></script>
<script src="scripts/scripts.f9d73ac6.js"></script>
于 2016-08-30T19:43:19.527 に答える