9

在多个 MVC 项目之间共享功能非常简单。您只需将代码放入自己的项目中,并在尽可能多的解决方案中引用它即可。干净、标准、光荣。

有没有办法为代码样式做这个?我希望在一个地方拥有我们的通用 CSS 文件,这些文件使我们的应用程序具有相似的外观和感觉。现在我必须为每个新应用程序生成新副本。因此,如果需要修复某些东西,则需要在十几个地方修复十多次。

有没有其他人处理过这个?我不能将 CSS 文件分离到他们自己的项目中,我也不想拥有一个只是css 的 Web 应用程序,以便所有应用程序都可以通过完全限定的 Urls 远程使用这些文件。您是否可以使用源代码控制将文件链接在一起的 TFS 技巧?有什么我没有想到的吗?

4

7 回答 7

5

这是在不使用 CDN、LESS、SASS、NuGet 等的情况下在项目之间共享 Web 资源的“非常简单”的解决方案:

  1. 创建包含要共享的资源的通用解决方案文件夹,或者简单地将其中一个项目指定为主项目。
  2. 根据需要使用“添加为链接”将共享资源文件添加到每个项目中。
  3. AfterBuild任务添加到每个项目文件,将链接文件复制到项目文件夹。仅需要这样做,以便 Visual Studio 测试/调试 (F5) 可以在本地工作。

如果您需要有关如何执行此操作的详细信息,请继续阅读。

为共享资源配置解决方案文件夹

**请注意,如果您只是要将文件从一个项目直接共享到一个或多个其他项目,则可以跳过此步骤。

Visual Studio 解决方案文件夹不必反映物理文件系统文件夹,但这样做有助于保持理智。因此,首先在本地文件系统上创建文件夹并将资源文件复制到其中。新文件夹应位于您的解决方案文件夹下。例如:

\MySolution
   \Common
      \Images
      \Scripts
      \Styles

返回 Visual Studio,右键单击解决方案项目文件夹并使用添加解决方案文件夹复制新的文件系统文件夹。

接下来,通过右键单击每个文件夹并使用Add Existing Item添加文件夹的内容,将文件添加到新的解决方案文件夹中。

将共享资源添加为链接

对于将使用共享资源的每个项目,右键单击项目文件夹并选择Add Existing Item。浏览到公用文件夹,选择所需文件,单击“添加”按钮旁边的下拉箭头,然后选择“添加为链接”。

您可能会收到有关添加项目目录结构之外的文件的源代码控制警告,但这可以忽略,因为链接的文件将在其源代码控制下。

添加AfterBuild任务以复制文件

当您将应用程序发布到服务器时,链接的文件将复制到它们链接到的项目文件夹中,并且一切都按预期工作。但是,在开发环境中,链接文件实际上并不位于项目文件夹中。因此,当您在 VS 中按 F5 测试您的应用程序时,共享资源将丢失。

简单的解决方案是添加一个 MSBuild 任务,以便在每次构建后从其源中复制链接文件。需要对包含共享资源链接的每个项目执行此操作。

右键单击项目并选择Unload Project。再次右键单击该项目并选择Edit <ProjectFileName>。滚动到底部并添加以下内容(就在“</Project>”上方):

  <Target Name="AfterBuild">
    <!-- Copy linked content files to local folders so that they are available in the debugger. 
         This is only an issue when running the application locally. The linked files should 
         be automatically published to the correct folder when publishing to a web server. -->
    <Copy SourceFiles="%(Content.Identity)"
          DestinationFiles="%(Content.Link)"
          SkipUnchangedFiles='true'
          OverwriteReadOnlyFiles='true'
          Condition="'%(Content.Link)' != ''" />
  </Target>

**复制任务改编自TheCodeDestroyer 答案中的此链接。

保存项目文件,然后右键单击并选择Reload Project

于 2015-10-27T12:34:41.310 回答
2

为什么不让一个站点托管基本样式,而其他站点引用这些样式?我看不出这有什么问题。

您也可以创建一个 CDN 应用程序来执行此操作。

MVC 应用程序 #1

<link src="~/css/styles.css" />

MVC 应用程序 #2

<link src="http://mvcapp1.com/css/styles.css" />
于 2012-12-20T18:57:59.397 回答
2

好吧,我对asp.net开发了解不多,请见谅,如果不是这样,但是

如果项目中的资源文件将Build Action设置为NoneContent and Copy to Output Directory设置为Copy...,您可以轻松创建项目的类库类型并将所有文件放在那里(保留路径),然后在需要文件的每个项目中引用此“类库”。每个文件都将复制到解决方案构建时的每个引用项目。

对于嵌入式资源构建操作,它也可以工作,但是,您需要找到一种方法来指定包含这些文件的程序集(因为它不同于Assembly.GetEntryAssembly)。

于 2012-12-20T19:47:13.713 回答
2

就我个人而言,我不喜欢或不希望 CDN 解决方案就像您有很多页面一样,它们依赖于 CDN 100% 的正常运行时间。经过一些研究,我发现这个解决方案非常适合我的使用,我希望谁会寻找替代方案,这是其中之一:

http://mattperdeck.com/post/Copying-linked-content-files-at-each-build-using-MSBuild.aspx

于 2013-09-19T13:28:21.737 回答
1

1 - 研究 CSS 模板系统,如前所述:

SASS-Lang Less

http://css-tricks.com/sass-vs-less/(非常好的文章开始,许多相关项目在他的相关帖子小部件中)

这些允许您以有组织的方式对样式表进行编码。您可以轻松快速地添加动态配置和全局更改。

2 - 开发您自己的 CSS 全局列表系统:

如果你不想使用上面的 CSS 样式表系统。例子

//cdn.com/assets/css/reset.css
//cdn.com/assets/css/main.css
//cdn.com/assets/css/page_home.css
//cdn.com/assets/css/page_cart.css

甚至...

//cdn.com/assets/global/form_styles.css
//cdn.com/assets/global/global_shortcuts.css

在这些中,同form padding、table和tr等padding规则。例子

.black{color:#000 !important}
.right{float:right}
.left{float:left}

我知道我听起来像框架心态,但它有效..

您可以快速更改全局以确保更新所有页面。

CDN 存储和指南针建议也是有效的。您会看到存储在 CDN 上将省去担心应用程序故障/速度/负载的麻烦。

您的应用程序可以简单地像

/cloud/servers/settings/global/db
/cloud/servers/settings/global/librarys
/cloud/servers/settings/global/css_config.php (example)

/cloud/servers/1/webapp.com/
/cloud/servers/1/webapp.com/model
/cloud/servers/1/webapp.com/view
/cloud/servers/1/webapp.com/view/themes/tpl
/cloud/servers/1/webapp.com/inc

/cloud/servers/1/webapp2.com/
/cloud/servers/1/webapp2.com/model
/cloud/servers/1/webapp2.com/view
/cloud/servers/1/webapp2.com/view/themes/tpl
/cloud/servers/1/webapp2.com/inc

//cdn.com/assets/css

3 - 方法的配置

我个人认为问题应该是关于你的整体开发方法的方法。将 CSS 放在 CDN 应用程序上,或者将 CSS 放在与 CDN 同步以用于生产实时模式的单独服务器上是一个好主意 - 将其分开并通过样式表语言进行维护会更好。然后,您可以快速使用皮肤、css 库、图像库等。使事情井井有条,更快,更好,令人愉悦,并以编码为荣。

保留它并使用更好的系统是我们所需要的。您应该使用文件夹结构 IMO 的手动和经典方法。您不必担心移动/平板电脑的响应式应用程序设计和其他轴承问题,因为更新所有应用程序甚至单个应用程序的 CSS 行 - 甚至是语言,以及与多站点开发团队打交道。

只是我的拙见

还强烈推荐一种 CSS 样式表语言,当然很多人讨厌它们。但是它们变得非常有用,尤其是 SAAS,它不像 NodeJS 那样大肆宣传......它确实有效。并创造奇迹。看看 TopShop、GorgeousCouture.. Arcadia 网站.. 多种语言、多种货币.. 服务器和团队在同一个跨品牌和每个商店的多个应用程序上工作..

于 2012-12-20T19:47:00.313 回答
1

我们遇到了同样的问题,出于我们的目的,我们将所有通用 CSS/JS/Images/Layout View 放入 NuGet 包中,并在我们需要的每个应用程序中重用它。它非常适合我们。

于 2013-11-15T17:25:47.060 回答
0

如果您愿意使用 Sass,那么 Compass 扩展可能正是您所需要的。

http://compass-style.org/help/tutorials/extensions/

一个扩展,当捆绑为一个 gem 时,允许您从安装了 gem 的系统上的任何位置轻松地包含 gem 中包含的样式。我最近在我的最新应用程序中使用了它(一个专门的多用户 CMS,每个用户都有自己的子域,具有自定义布局,但所有组件/小部件在整个应用程序中都具有相同的样式)。设置新子域的样式就像运行单个命令并自定义我设置的具有简单布局骨架的模板一样简单。

Compass 扩展用于将图像和 JavaScript 文件作为模板的一部分保存,但部署的文件不会像样式那样自动更新(来自 Compass 扩展的模板与样式表不同,因为模板用于复制而样式表是用于导入)。

于 2012-12-20T19:30:31.207 回答