Используйте Chart.js & jQuery в Ionic Framework

Question

Мы хотим включить Chart.js & jQuery в наш проект Ionic / Angular.

После установки через npm мы пытаемся ссылаться на файлы ниже, как обычно:

<script src="../node_modules/chart.js/dist/Chart.min.js"></script>

Что мы делаем не так? Мы также включили ссылку по какой-то причине в packages.json:

  "scripts": {
    ...
    "chart": "../node_modules/chart.js/dist/Chart.js"

Если мы используем CDN, он работает ... Но зачем мне тогда использовать npm для установки? Я не понимаю ...

• "@ ionic-native / core": "~ 4.12.0"
• Ионная версия CLI 6.4.1
• "ионно-угловой": "3.9.2" Мы получаем сообщение о неисправности, как показано ниже:

Отказался выполнять скрипт из 'http://localhost:8100/node_modules/jquery/dist/jquery.js', потому что его MIME-тип ('text / html') не является исполняемым, а строгий MIME-тип проверка включена.

Полный вывод ошибок:

Ошибка: Uncaught (в обещании): ReferenceError: Диаграмма не определена ReferenceError: Диаграмма не определена на UIChart.webpackJsonp.500.UIChart.initChart (http://localhost:8100/build/0.js:173:26) на UIChart.webpackJsonp.500.UIChart.ngAfterViewInit (http://localhost:8100/build/0.js:154:14) на callProviderLifecycles (http://localhost:8100/build/vendor.js:13123:18) at callElementProvidersLifecycles (http://localhost:8100/build/vendor.js:13090:13) at callLifecycleHooksChildrenFirst (http://localhost:8100/build/vendor.js:13073:29) при checkAndUpdateView (http://localhost:8100/build/vendor.js:14228:5) при callViewAction (http://localhost:8100/build/vendor.js:14570:21) at execComponentViewsAction (http://localhost:8100/build/vendor.js:14502:13) при checkAndUpdateView (http://localhost:8100/build/vendor.js:14225:5) at callWithDebugContext (http://localhost:8100/build/vendor.js:15473:42) в с (http://localhost:8100/build/polyfills.js:3:19752) в с (http://localhost:8100/build/polyfills.js:3:19461) в http://localhost:8100/build/polyfills.js:3:20233 при t.invokeTask (http://localhost:8100/build/polyfills.js:3:15660) в Object.onInvokeTask (http://localhost:8100/build/vendor.js:5126:33) в t.invokeTask (http://localhost:8100/build/polyfills.js:3:15581) в r.runTask (http://localhost:8100/build/polyfills.js:3:10834) в о (http://localhost:8100/build/polyfills.js:3:7894)

Друг предположил, что, возможно, нам нужно установить Browserify или Webpack. Попробую это ...

Answer 1

Если вы используете диаграммы js через node_modules, вам не нужно включать через <script src="">

Когда вы выполняете ionic serve, вы загружаете node_modules и выполняете их.

Также вы пытаетесь использовать npm start вместо ionic serve, чтобы проверить, может ли решить вашу проблему. Дайте мне знать, как идут дела.