Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/461.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ruby-on-rails/54.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 添加chart.js后,应用程序不再正确显示_Javascript_Ruby On Rails_Chart.js_Yarnpkg_Webpacker - Fatal编程技术网

Javascript 添加chart.js后,应用程序不再正确显示

Javascript 添加chart.js后,应用程序不再正确显示,javascript,ruby-on-rails,chart.js,yarnpkg,webpacker,Javascript,Ruby On Rails,Chart.js,Yarnpkg,Webpacker,我想开始使用chart.js、Rails 6应用程序和Webpacker。我做了以下工作: Rails 6 Bootstrap webpacker OS: Mac Catalina 10.15.4 我在app/javascript/packs/application.js中添加了以下内容 yarn add chart.js 当我重新启动应用程序时,用户界面乱七八糟。正如在中一样,徽标占据了页面的一半,而登录页面(本应显示一个表格)显示的是表格,但它没有格式化。就好像大部分(如果不是全部的话)

我想开始使用chart.js、Rails 6应用程序和Webpacker。我做了以下工作:

Rails 6
Bootstrap
webpacker
OS: Mac Catalina 10.15.4
我在app/javascript/packs/application.js中添加了以下内容

yarn add chart.js
当我重新启动应用程序时,用户界面乱七八糟。正如在中一样,徽标占据了页面的一半,而登录页面(本应显示一个表格)显示的是表格,但它没有格式化。就好像大部分(如果不是全部的话)页面/应用程序格式信息都消失了

当我检查我所更改的内容时,它显示以下文件已被修改(除了我对app/javascript/packs/application.js所做的手动修改):

在文件:warn.lock中,添加了以下内容:

package.json, the following was added to the dependencies section:

"chart.js": "^2.9.3"

如果我恢复更改并重新启动应用程序,一切正常。我想在我的应用程序中使用chart.js。有什么想法吗?

可能与您现有的样式表冲突?我不明白您的意思。唯一的变化是,使用yarnmight添加chart.js可能与您现有的样式表冲突?我不明白您的意思。唯一的变化是使用纱线添加了chart.js
package.json, the following was added to the dependencies section:

"chart.js": "^2.9.3"
chart.js@^2.9.3:
  version "2.9.3"
  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.3.tgz#ae3884114dafd381bc600f5b35a189138aac1ef7"
  integrity sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==
  dependencies:
    chartjs-color "^2.1.0"
    moment "^2.10.2"

chartjs-color-string@^0.6.0:
  version "0.6.0"
  resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
  integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
  dependencies:
    color-name "^1.0.0"

chartjs-color@^2.1.0:
  version "2.4.1"
  resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
  integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
  dependencies:
    chartjs-color-string "^0.6.0"
    color-convert "^1.9.3"