Как обновить загрузчик на веб-сайте .net core 2 - PullRequest
0 голосов
/ 14 мая 2018

Я почти уверен, что это очень просто, но я не мог понять, как обновить загрузчик с 3.3.7 до 4.1.1.

Что я сделал, изменил это на странице _layout, согласнодо версии

  <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
          asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
          asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />

Что еще нужно.

Я также видел в диспетчере пакетов Nuget, но думаю, что потребуется больше изменений, и я не знаю, как это сделать, сохраняя контроль над версиями и самим проектом.

ОБНОВЛЕНИЕ

Я нашел файл bower.json в папке wwwroot / lib / bootstrap, и всегда менял его3.3.7 и замените его на 4.1.1, однако есть номер коммита, я не знаю, что это такое.

{
  "name": "bootstrap",
  "description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
  "keywords": [
    "css",
    "js",
    "less",
    "mobile-first",
    "responsive",
    "front-end",
    "framework",
    "web"
  ],
  "homepage": "http://getbootstrap.com",
  "license": "MIT",
  "moduleType": "globals",
  "main": [
    "less/bootstrap.less",
    "dist/js/bootstrap.js"
  ],
  "ignore": [
    "/.*",
    "_config.yml",
    "CNAME",
    "composer.json",
    "CONTRIBUTING.md",
    "docs",
    "js/tests",
    "test-infra"
  ],
  "dependencies": {
    "jquery": "1.9.1 - 3"
  },
  "version": "4.4.1",
  "_release": "4.4.1",
  "_resolution": {
    "type": "version",
    "tag": "v4.1.1",
    "commit": "0b9c4a4007c44201dce9a6cc1a38407005c26c86"
  },
  "_source": "https://github.com/twbs/bootstrap.git",
  "_target": "v4.1.1",
  "_originalSource": "bootstrap",
  "_direct": true
}

это не работает.Ссылка на макет для bootstrap cdn по-прежнему указывает на 3.3.7, а файлы начальной загрузки в папке lib не обновлялись при сохранении файла bower.

Ответы [ 3 ]

0 голосов
/ 09 июля 2018

Пока я занимался этим вопросом, я наткнулся на этот пост. Я подумала, что подумаю, если кто-то ищет достойное решение.

Сам шаблон имеет «разовое» включение начальной загрузки 3.3.7. К сожалению, хотя команда ASP.NET Core находится в постоянном движении, некоторые функции интерфейса, безусловно, отсутствуют.

Бауэр теперь исключен https://bower.io/blog/

Некоторые перешли на Grunt, Gulp или Yarn + Webpack. Также в какой-то момент ASP.NET Core включил gulpfile в шаблон проекта, но так и не смог превзойти RC в стабильной версии. Настройка вашего проекта для использования любой из платформ для этого является делом, и некоторые, как я, просто ищут бинты, вместо того, чтобы изучать новые платформы, или сильно опираются на Node.js (NPM)

Итак, вот как я решил эту проблему:

  1. Установить NPM
  2. Создать пустой проект npm init
  3. Установить зависимости
    • npm install bootstrap
    • npm install font-awesome * note1
    • npm install jquery
    • npm install popper.js
  4. Скопируйте папки из / node_modules / в / wwwroot / lib / * note2
  5. Замените ссылки CSS и теги сценария в вашем _Layout.cs на приведенный ниже код.

Примечание 1: Bootstrap 3.3.7 содержит глифы, если вы хотите использовать иконки в своем веб-проекте, я (и Bootstrap) рекомендует Font-Awesome. Font-Awesome на момент написания статьи 5.1.0. Я решил не использовать новую версию. Если вам нужна последняя версия, вам нужно использовать npm install font-awesome-free

Примечание 2: Вам НЕ нужны все эти файлы, но для краткости я не перечислил минимально необходимые файлы. По большей части вам нужно только то, что находится в папке <dependency>\dist\.


_Layout.cshtml

В теге <head>

<environment include="Development">
    <link href="~/lib/bootstrap/dist/css/bootstrap.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/css/site.css" />
</environment>

<environment exclude="Development">
    <link rel="stylesheet"
          href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"
          integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB"
          crossorigin="anonymous"
          asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
          asp-fallback-test-class="sr-only"
          asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>

До тега </body>

<environment include="Development">
    <script src="~/lib/jquery/dist/jquery.slim.js"></script>
    <script src="~/lib/jquery/dist/jquery.js"></script>
    <script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
    <script src="~/js/site.js" asp-append-version="true"></script>
</environment>

<environment exclude="Development">
@* Get your own CDN link from 
   https://fontawesome.com/v4.7.0/get-started/
*@
    <script src="SEE ABOVE NOTE"></script>

    <script src="https://code.jquery.com/jquery-3.3.1.min.js"
            asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
            asp-fallback-test="window.jQuery"
            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
            crossorigin="anonymous">
    </script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
            asp-fallback-src="~/lib/popper.js/dist/umd/popper.min.js"
            asp-fallback-test="window.Popper" 
            integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
            crossorigin="anonymous">
    </script>

    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"
            asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
            integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T"
            crossorigin="anonymous">
    </script>

    <script src="~/js/site.min.js" asp-append-version="true"></script>
</environment>
0 голосов
/ 13 августа 2018

В Visual Studio 2017 15.7 вы можете использовать еще не выпущенный LibMan (менеджер библиотек), чтобы получить новейшую библиотеку Bootstrap.

  1. Откройте ваш веб-проект
  2. Перейдите в Инструменты -> Диспетчер пакетов Nuget-> Консоль диспетчера пакетов Nuget
  3. Тип

    PM>Install-Package Microsoft.Web.LibraryManager.Build -Version 1.0.113
    
  4. После установки диспетчера библиотек создайте libman.json в корне вашего решения

  5. Отформатируйте ваш libman.json как показано ниже

    {
      "version": "1.0",
      "defaultProvider": "cdnjs",
      "defaultDestination": "wwwroot/lib",
      "libraries": [
        {
          "library": "jquery@3.0.0",
          "files": [
            "core.js",
            "jquery.js",
            "jquery.min.js",
            "jquery.min.map",
            "jquery.slim.js",
            "jquery.slim.min.js",
            "jquery.slim.min.map" 
          ],
          "destination": "wwwroot/lib/jquery"
        },
        {
          "library": "twitter-bootstrap@4.1.3",
          "files": [
            "css/bootstrap-grid.css",
            "css/bootstrap-grid.css.map",
            "css/bootstrap-grid.min.css",
            "css/bootstrap-grid.min.css.map",
            "css/bootstrap-reboot.css",
            "css/bootstrap-reboot.css.map",
            "css/bootstrap-reboot.min.css",
            "css/bootstrap-reboot.min.css.map",
            "css/bootstrap.css",
            "css/bootstrap.css.map",
            "css/bootstrap.min.css",
            "css/bootstrap.min.css.map",
            "js/bootstrap.bundle.js",
            "js/bootstrap.bundle.js.map",
            "js/bootstrap.bundle.min.js",
            "js/bootstrap.bundle.min.js.map",
            "js/bootstrap.js",
            "js/bootstrap.js.map",
            "js/bootstrap.min.js",
            "js/bootstrap.min.js.map" 
          ],
          "destination": "wwwroot/lib/bootstrap"
        }
      ]
    }
    
  6. Затем перестройте свое решение. вуаля!

0 голосов
/ 14 мая 2018

Я не думаю, что вам нужно использовать NuGet.Вместо этого вы должны использовать bower.json.Также ваш _layout может быть неправильным.

Для меня я указываю информацию о версии в bower.json.Вот что у меня есть:

{
  "name": "asp.net",
  "private": true,
  "dependencies": {
    "underscore": "~1.8.3",
    "jquery": "~3.3.1",
    "jquery-validation": "~1.17.0",
    "jquery-validation-unobtrusive": "~3.2.9",
    "bootstrap": "~3.3.5",
    "font-awesome": "~5.0.10",
    "bootswatch": "~3.3.7"
  }
}

Для вас вы можете указать версию начальной загрузки 4.1.1.После сохранения соответствующий загрузчик будет загружен автоматически.

На моей странице _layout у меня есть только следующее:

<head>
    <meta charset="utf-8" />
    <title>Travel Agency - @ViewBag.Title</title>

    <link rel="stylesheet" href="~/lib/font-awesome/web-fonts-with-css/css/fontawesome-all.min.css" />
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href="~/lib/bootswatch/yeti/bootstrap.min.css" />
    <link rel="stylesheet" href="~/css/site.css" />
</head>

Надеюсь, это поможет.

...