如何参考Bower添加的包裹?

时间:2023-01-24 09:18:05

In VS.NET 2015, I've added a reference in bower.json for angularjs. This caused the angularjs package to be downloaded, which I can see in the Bower folder.

在VS.NET 2015中,我在bower.json中为angularjs添加了一个引用。这导致了angularjs包的下载,我可以在Bower文件夹中看到。

However, I'm not able to execute any angularjs code. I do have an ng-app in the HTML tag. If I add a CDN reference to the angularjs library, it works fine.

但是,我无法执行任何angularjs代码。我在HTML标签中有一个ng-app。如果我向angularjs库添加CDN引用,它可以正常工作。

What am I missing to use the package downloaded by Bower?

使用Bower下载的软件包我错过了什么?

2 个解决方案

#1


7  

what are you missing is referencing the downloaded libraries in bower_components folder in your index.html.

您缺少的是在index.html中的bower_components文件夹中引用下载的库。

For example let's say you added restangular to bower. the library while reside in ./bower_components/restangular so in your index.html ( your SPA). you will reference it like this :

例如,假设你向bower添加了restangular。该库位于./bower_components/restangular中,因此在index.html(您的SPA)中。你会像这样引用它:

    <script src="../bower_components/restangular/dist/restangular.js"></script>

Beware sometimes you should add all the library main files ( js and css), for that you need to check the value of the main attribute included in the bower.json of the library . for our example in bower.json in ../bower_components/restangular/ we have:

请注意,有时您应该添加所有库主文件(js和css),因为您需要检查库的bower.json中包含的主要属性的值。对于我们在../bower_components/restangular/中的bower.json中的示例,我们有:

"main": "./dist/restangular.js", In a the file .bowerrc you may define the directory for the downaloaded libraries in my example it will be bower_components.

“main”:“。/ dist /restangular.js”,在.bowerrc文件中,您可以在我的示例中定义下载库的目录,它将是bower_components。

In your .csproj file add the

在.csproj文件中添加

    <Content Include="bower_components/restangular/dist/restangular.js" />

Use can see this example

使用可以看到这个例子

#2


1  

Since more than likely for production deployment you won't be deploying things in bower_components directory, I suggest you setup a gulp or grunt task to copy all the JavaScript that you are going to use and probably minify and concat / bundle them into a folder in wwwroot like /lib or /js or whatever your convention is going to be and add a script tag pointing to that bundled version. There is a decent walkthrough by Mads Kristensen from the recent Build event that you might want to look at. He demoed all the things you would probably need to get your app running.

由于生产部署的可能性很大,你不会在bower_components目录中部署东西,我建议你设置一个gulp或grunt任务来复制你将要使用的所有JavaScript,并且可能将它们缩小并连接/捆绑到一个文件夹中wwwroot喜欢/ lib或/ js或者你的约定,并添加一个指向该捆绑版本的脚本标记。 Mads Kristensen在最近的Build活动中有一个不错的演练,你可能想看看。他演示了运行应用程序所需的所有内容。

#1


7  

what are you missing is referencing the downloaded libraries in bower_components folder in your index.html.

您缺少的是在index.html中的bower_components文件夹中引用下载的库。

For example let's say you added restangular to bower. the library while reside in ./bower_components/restangular so in your index.html ( your SPA). you will reference it like this :

例如,假设你向bower添加了restangular。该库位于./bower_components/restangular中,因此在index.html(您的SPA)中。你会像这样引用它:

    <script src="../bower_components/restangular/dist/restangular.js"></script>

Beware sometimes you should add all the library main files ( js and css), for that you need to check the value of the main attribute included in the bower.json of the library . for our example in bower.json in ../bower_components/restangular/ we have:

请注意,有时您应该添加所有库主文件(js和css),因为您需要检查库的bower.json中包含的主要属性的值。对于我们在../bower_components/restangular/中的bower.json中的示例,我们有:

"main": "./dist/restangular.js", In a the file .bowerrc you may define the directory for the downaloaded libraries in my example it will be bower_components.

“main”:“。/ dist /restangular.js”,在.bowerrc文件中,您可以在我的示例中定义下载库的目录,它将是bower_components。

In your .csproj file add the

在.csproj文件中添加

    <Content Include="bower_components/restangular/dist/restangular.js" />

Use can see this example

使用可以看到这个例子

#2


1  

Since more than likely for production deployment you won't be deploying things in bower_components directory, I suggest you setup a gulp or grunt task to copy all the JavaScript that you are going to use and probably minify and concat / bundle them into a folder in wwwroot like /lib or /js or whatever your convention is going to be and add a script tag pointing to that bundled version. There is a decent walkthrough by Mads Kristensen from the recent Build event that you might want to look at. He demoed all the things you would probably need to get your app running.

由于生产部署的可能性很大,你不会在bower_components目录中部署东西,我建议你设置一个gulp或grunt任务来复制你将要使用的所有JavaScript,并且可能将它们缩小并连接/捆绑到一个文件夹中wwwroot喜欢/ lib或/ js或者你的约定,并添加一个指向该捆绑版本的脚本标记。 Mads Kristensen在最近的Build活动中有一个不错的演练,你可能想看看。他演示了运行应用程序所需的所有内容。