rollup.js-如何捆绑js和CSS文件？

Question

我正在尝试制作Vue组件。但是在那我想使用Owl Carousel jQuery库。我正在将.vue文件中的所有必需的库导入如下，

import $ from 'jquery';
window.$ = $;
import 'owl.carousel/dist/assets/owl.carousel.css';
import 'owl.carousel/dist/assets/owl.theme.default.css';
import 'owl.carousel';

但是当我编译组件时，我会在终端上收到这些警告，

(!) Unresolved dependencies
https://github.com/rollup/rollup/wiki/Troubleshooting#treating-module-as-external-dependency
owl.carousel/dist/assets/owl.carousel.css (imported by src/Carousel.vue?rollup-plugin-vue=script.js)
owl.carousel/dist/assets/owl.theme.default.css (imported by src/Carousel.vue?rollup-plugin-vue=script.js)
owl.carousel (imported by src/Carousel.vue?rollup-plugin-vue=script.js)
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
jquery (guessing '$')

并在控制台窗口中获取此错误，

Uncaught TypeError: Cannot read property 'fn' of undefined

这是我的rollup.conf.js，

import babel from 'rollup-plugin-babel';
import vue from 'rollup-plugin-vue';

export default {
  input: 'src/main.js',
  plugins: [
  vue(), 
  babel()
  ],
  external: ['jquery'],
  globals: {
    $ : 'jquery'
  },
  output: [
    {
      format: 'umd',
      name: 'VOwlCarousel',
      file: 'dist/v-owl-carousel.js',
    },
    {
      format: 'es',
      file: 'dist/v-owl-carousel.esm.js',
    },
  ],
};

谢谢。