uncaught SyntaxError: Неожиданный экспорт токена произошел в popper.js: 2371 - PullRequest
0 голосов
/ 30 сентября 2018

Я новичок в начальной загрузке и jquery.Я пытаюсь использовать функцию datatables, такую ​​как сортировка, при запуске моих кодов я получаю эту ошибку в консоли:

uncaught SyntaxError: Unexpected token export at popper.js:2371 

моя версия popper.js: 1.14.3, и я отображаю ее в своем макете какэто:

<body>
    @Html.Partial("_navbar")
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year -www.vidly.com @*My ASP.NET Application*@</p>
        </footer>
    </div>
 @*   @Scripts.Render("~/bundles/lib")*@
  @Scripts.Render("~/Scripts/jquery-3.3.1.js")
  @Scripts.Render("~/Scripts/DataTables/jquery.dataTables.min.js")
  @Scripts.Render("~/Scripts/DataTables/dataTables.bootstrap4.min.js")

  @Scripts.Render("~/Scripts/popper.js")
  @Scripts.Render("~/Scripts/bootstrap.js")
  @Scripts.Render("~/Scripts/bootbox.js")
  @Scripts.Render("~/Scripts/respond.js")
  @Scripts.Render("~/Scripts/DataTables/jquery.dataTables.js")
  @Scripts.Render("~/Scripts/DataTables/DataTables.bootstrap.js")
    @*@Styles.Render("~/Content/css")*@

    @RenderSection("scripts", required: false)
</body>

и this is картина моего браузера, здесь у меня есть 2 вопроса: 1. почему я получаю эту ошибку:

uncaught SyntaxError: Unexpected token export at popper.js:2371

2. Почему функции данных, такие как количество страниц и методы сортировки, нерегулярны в моем браузере (как вы видели на картинке), это мои css-пакеты:

 bundles.Add(new StyleBundle("~/Content/css").Include(

                      "~/Content/bootstrap-lumen.css",
                      "~/Content/DataTables/css/dataTables.bootstrap.css",
                      "~/Content/site.css"));

Я отображаю это в моем _layout:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @*@Scripts.Render("~/bundles/lib")*@
    @Styles.Render("~/Content/css") 
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @Html.Partial("_navbar")
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year -www.vidly.com @*My ASP.NET Application*@</p>
        </footer>
    </div>
    @Scripts.Render("~/bundles/lib")

    @RenderSection("scripts", required: false)
</body>
</html>

TIA

1 Ответ

0 голосов
/ 01 октября 2018

Неожиданный экспорт токена в popper.js при связывании указывает, что для библиотеки Popper требуется UMD-версия сборки соответствующего JS-файла, который здесь неправильно задан (возможно, вы используете версию ESNext):

@Scripts.Render("~/Scripts/popper.js")

Импорт версии UMD необходим, поскольку мы хотим импортировать его с тегом <script>, созданным механизмом связывания (System.Web.Optimization), как написано на официальной странице .

Если вы хотите импортировать его с тегом <script>, используйте UMD.

Вот эти шаги для использования версии UMD с комплектацией MVC:

1) Получить версию UMD из пакета dist можно здесь: https://unpkg.com/popper.js@1.14.4/dist/umd/

2) Сохраните пакет UMD в папке /Scripts/umd.

3) Создайте JS-пакетыв методе RegisterBundles() с указанными путями, как в примере ниже:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    "~/Scripts/jquery-*",
    // other jQuery scripts here
));

bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
    "~/Scripts/umd/popper.js", // set to UMD version
    "~/Scripts/bootstrap.js",
    "~/Scripts/bootbox.js",
    "~/Scripts/respond.js",

    // other Bootstrap scripts here
));

4) Используйте @Scripts.Render() помощник на странице макета, чтобы включить их (обратите внимание, что порядок сценариев имеет значение):

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")

Примечание: Если вы ищете ESNext версию Popper.js по сравнению с UMD-версией , вы увидите этот заголовок в последнем, который не существует впрежний:

(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    (global.Popper = factory());
}(this, (function () {
    // skipped for brevity
})));

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * [10] * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *}}}} оно не относится к глобальной области;Похоже, файлы CSS не включены должным образом.Обратитесь к разделу Связывание и минификация для импорта CSS-пакетов.

Связанные проблемы:

Как использовать Popper.js с Bootstrap 4 beta

popper.js в начальной загрузке 4 дает SyntaxError Неожиданный экспорт токена

...