After attempting to import through the entry file (main.js)...
import Vue from 'vue'
import App from '@/App'
import router from '@/router/router'
import store from '@/store/store'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import { Popover } from 'bootstrap-vue/es/directives'
import 'https://mycompany/main.min.css'
Vue.use(BootstrapVue)
Vue.use(Popover)
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
store,
router,
template: '<App/>',
components: { App }
})
I've explored options within webpack.base.config (externals or publicPath) by referring to various online resources, but none provided a satisfactory solution...
The CSS file obtained via CDN is dependent on and overrides Bootstrap classes, requiring that it be injected after Bootstrap. Can this be achieved with my existing setup in Vue/Webpack, or do I need a task runner like Gulp? Simply injecting the CDN after project build doesn't suffice as style changes should be visible during development work. Is there a simpler method than the aforementioned approaches? And just for clarification, making it an npm package is not an option due to privacy/security concerns.