none
アプリケーションページ開発時の JS/CSS ファイルの設置場所について RRS feed

  • 質問

  • はじめまして。
    現在、VS2008 + VSeWWS を使用してアプリケーションページの開発をしています。
    その際に幾つか独自の JS/CSS をファイルを作成し、ページから参照する必要があるのですが、
    一般的にはどの様な手法が考えられるのでしょうか?
    (REST 形式でデータを提供するアプリが別にあり、アプリケーションページから jQuery を使用し
    大半の UI を JavaScript のみで構築する様なアプリを想定しています)

    アプリケーションページの開発方法は、書籍「VSTO と ShrePoint Server 2007 による開発技術」を
    参考に、おおまかに下記の様な構成で作成しています。

    -----
    Web Application Project
     |- _layouts
       |- application.master(ダミーのマスタページ)
       |- WebForm.aspx

    SharePoint Empty Project(VSeWSS で作成した空の配置用プロジェクト)
     |-Templates
       |-Layouts
         |-{Application Name}
           |- WebFrom.aspx(上記プロジェクト内のページへのリンク)
    -----
     
    普通に考えると下記の様な構成にしたいのですが、SharePoint、ASP.NET 共に経験が無く
    まだ文化、お作法が理解しきれておりません。

    -----
    Web Application Project
     |- _layouts
       |- application.master(ダミーのマスタページ)
       |- WebForm.aspx
       |- js
         |- カスタム js ファイル
       |- css
         |- カスタム css  ファイル

    SharePoint Empty Project(VSeWSS で作成した空の配置用プロジェクト)
     |-Templates
       |-Layouts
         |-{Application Name}
           |- WebFrom.aspx(上記プロジェクト内のページへのリンク)
           |- js (フォルダへのリンク)
           |- css(フォルダへのリンク)
    -----

    上記はまずフォルダへのリンクというものが作れないので無理でした。
    その為、配置用プロジェクトの方に JS/CSS ファイルを設置する事も考えましたが、
    どの方法においても素人の私が想像してやっているに過ぎない為、それが適切な方法なのかが
    分からず、皆様の知恵をお借りしたいと思った次第です。

    ちなみに DLL についても同様で、このプロジェクトだけで使用したい DLL は皆さんはどの様に
    設置しているのかについてもお聞かせ頂ければ幸いです。
    個人的にはひとつのプロジェクトでしか使用しない DLL は GAC に登録するのはおかしい、と
    思いますが、VSeWWS を使用してのプロジェクト内に DLL を配置する様な例も今のところ見た事が
    ありません。(しかも試すと bin ディレクトリは展開されない)

    Java の開発が長かった為、基本的に共有する必要ないリソースはプロジェクト内に全ての同梱し、
    配置をする。という考えがベースにあるのですが、何か根本的に理解が足りない領域があるのかもしれません。

    ご回答の他、まずはここ見ろというご意見でも構いません。
    以上、長文失礼致しました。

    よろしくお願い致します。
    2009年5月19日 7:48

回答

  • こんにちは。
    マイクロソフトの小松です。

    書籍「VSTO と ShrePoint Server 2007 による開発技術」をご利用いただきありがとうございます。
    「フォルダへのリンクを作るには」、「dllをbinディレクトリに配置するには」というご質問ですね。

    1. フォルダへのリンクを作るには
    Visual Studioからフォルダへのリンクが作れると便利ですよね。
    これ、VSのUIからは作れないんですが、プロジェクトファイルを直接編集するとフォルダへのリンクっぽいものを作ることができます。

    まず、VSのソリューションとプロジェクトのフォルダ構成は以下のようになっていると仮定します。
    -----
    SharePoint Application Page Solution
     |- Web Application Project (WebApplication1というフォルダ名と仮定する)
     |   |- _layouts
     |     |- application.master(ダミーのマスタページ)
     |     |- WebForm.aspx
     |     |- js
     |       |- カスタム js ファイル
     |     |- css
     |       |- カスタム css  ファイル
     |
     |- SharePoint Empty Project(VSeWSS で作成した空の配置用プロジェクト)
         |-Templates
           |-Layouts
             |-{Application Name} (MyWebApplication1というフォルダ名と仮定する)
               |- WebFrom.aspx(上記プロジェクト内のページへのリンク)
               |- js (フォルダへのリンク)
               |- css(フォルダへのリンク)
    -----

    で、VSeWSSのプロジェクトファイルをメモ帳等のテキストエディタで開いて、以下のItemGroupのブロックを追加してください。
    フォルダ名は、前述のフォルダ構成にあるフォルダ名にしてありますので、適宜ご自分の環境のフォルダ名と入れ替えてください。

      <ItemGroup>
        <Content Include="..\WebApplication1\js\*.js">
          <Link>Templates\Layouts\MyWebApplication1\js\xxx</Link>
        </Content>
        <Content Include="..\WebApplication1\css\*.css">
          <Link>Templates\Layouts\MyWebApplication1\css\xxx</Link>
        </Content>
      </ItemGroup>
    

    このように指定すると、jsフォルダ内のすべての".js"という拡張子を持つファイルがリンクとして読み込まれます。cssフォルダも同様に".css"という拡張子を持つファイルが読み込まれます。
    ただし、Web Applicationプロジェクトのjsフォルダにファイルを追加しても、自動的にVSeWSSプロジェクトに読み込まれるわけではありません。
    ファイルを追加した後、フォルダの内容を同期させるには、プロジェクトのアンロードをして再び読み込む等の作業が必要になります。


    2. プロジェクト固有のDLLをbinディレクトリに配置するには
    これも実現できるのですが、少し(だいぶかな、、、)分かりにくいんです。
    以下の手順でdllをbinディレクトリに配置できるようになります。

    1) dllを追加する
    まず、配置したいdllをソリューションエクスプローラにドロップするなどして、VSeWSSプロジェクトにdllを追加します。
    ここでは、MyAssembly.dllというdllを追加したことにします。
    こうすることでこのdllがGACに配置されるようになります。

    2) ソリューションのマニフェストを編集する
    続いて、WSPビューからソリューションのマニフェストファイル(manifest.xml)を開きます。
    この時、WSPビューの更新ボタンを押してからマニフェストファイルを開くようにしてください。
    すると、MyAssembly.dllに関する以下のような記述を見つけることができると思います。
    ここで、DeploymentTarget属性の値を"WebApplication"に変更します。

      <Assembly Location="MyAssembly.dll" DeploymentTarget="WebApplication" />

    こうすることでこのdllがbinディレクトリに配置されるようになります。

    3) ソリューションを配置する
    通常通りソリューションを配置すると、binフォルダの下にdllが配置されます。


    ---
    マイクロソフト ディベロップメント 株式会社
    小松 真也

    2009年6月4日 12:54

すべての返信

  • こんにちは。
    マイクロソフトの小松です。

    書籍「VSTO と ShrePoint Server 2007 による開発技術」をご利用いただきありがとうございます。
    「フォルダへのリンクを作るには」、「dllをbinディレクトリに配置するには」というご質問ですね。

    1. フォルダへのリンクを作るには
    Visual Studioからフォルダへのリンクが作れると便利ですよね。
    これ、VSのUIからは作れないんですが、プロジェクトファイルを直接編集するとフォルダへのリンクっぽいものを作ることができます。

    まず、VSのソリューションとプロジェクトのフォルダ構成は以下のようになっていると仮定します。
    -----
    SharePoint Application Page Solution
     |- Web Application Project (WebApplication1というフォルダ名と仮定する)
     |   |- _layouts
     |     |- application.master(ダミーのマスタページ)
     |     |- WebForm.aspx
     |     |- js
     |       |- カスタム js ファイル
     |     |- css
     |       |- カスタム css  ファイル
     |
     |- SharePoint Empty Project(VSeWSS で作成した空の配置用プロジェクト)
         |-Templates
           |-Layouts
             |-{Application Name} (MyWebApplication1というフォルダ名と仮定する)
               |- WebFrom.aspx(上記プロジェクト内のページへのリンク)
               |- js (フォルダへのリンク)
               |- css(フォルダへのリンク)
    -----

    で、VSeWSSのプロジェクトファイルをメモ帳等のテキストエディタで開いて、以下のItemGroupのブロックを追加してください。
    フォルダ名は、前述のフォルダ構成にあるフォルダ名にしてありますので、適宜ご自分の環境のフォルダ名と入れ替えてください。

      <ItemGroup>
        <Content Include="..\WebApplication1\js\*.js">
          <Link>Templates\Layouts\MyWebApplication1\js\xxx</Link>
        </Content>
        <Content Include="..\WebApplication1\css\*.css">
          <Link>Templates\Layouts\MyWebApplication1\css\xxx</Link>
        </Content>
      </ItemGroup>
    

    このように指定すると、jsフォルダ内のすべての".js"という拡張子を持つファイルがリンクとして読み込まれます。cssフォルダも同様に".css"という拡張子を持つファイルが読み込まれます。
    ただし、Web Applicationプロジェクトのjsフォルダにファイルを追加しても、自動的にVSeWSSプロジェクトに読み込まれるわけではありません。
    ファイルを追加した後、フォルダの内容を同期させるには、プロジェクトのアンロードをして再び読み込む等の作業が必要になります。


    2. プロジェクト固有のDLLをbinディレクトリに配置するには
    これも実現できるのですが、少し(だいぶかな、、、)分かりにくいんです。
    以下の手順でdllをbinディレクトリに配置できるようになります。

    1) dllを追加する
    まず、配置したいdllをソリューションエクスプローラにドロップするなどして、VSeWSSプロジェクトにdllを追加します。
    ここでは、MyAssembly.dllというdllを追加したことにします。
    こうすることでこのdllがGACに配置されるようになります。

    2) ソリューションのマニフェストを編集する
    続いて、WSPビューからソリューションのマニフェストファイル(manifest.xml)を開きます。
    この時、WSPビューの更新ボタンを押してからマニフェストファイルを開くようにしてください。
    すると、MyAssembly.dllに関する以下のような記述を見つけることができると思います。
    ここで、DeploymentTarget属性の値を"WebApplication"に変更します。

      <Assembly Location="MyAssembly.dll" DeploymentTarget="WebApplication" />

    こうすることでこのdllがbinディレクトリに配置されるようになります。

    3) ソリューションを配置する
    通常通りソリューションを配置すると、binフォルダの下にdllが配置されます。


    ---
    マイクロソフト ディベロップメント 株式会社
    小松 真也

    2009年6月4日 12:54
  • blms さん、こんにちは。フォーラムオペレーターの鈴木裕子です(^O^)/

    その後いかがでしたか?弊社 小松が回答させていただいた情報は参考になりましたでしょうか。
    無事に疑問が解決されたか気になるところですが、同様の疑問をお持ちの方に参考にしていただける内容だと思いまして、他の方も参照しやすいよう、勝手ながら私の方で[回答としてマーク]をつけさせていただきました。
    もちろん質問主はblms さんですので、引き続き質問がある場合や、不適当と思われた場合は、遠慮なくチェック解除してくださいね。

    これからも、技術者の皆様の情報交換の場としてForumをご活用ください!
    質問だけでなくコメントの方でも、ご参加お待ちしています(^v^)

    マイクロソフト株式会社 フォーラムオペレーター 鈴木裕子
    2009年6月25日 6:56
    モデレータ
  • 大変遅くなりましたが、ご回答ありがとうございました。
    詳細に記述して頂き、疑問であった部分も無事解決致しました :)
    2009年7月7日 4:36