在旧项目中使用 vue 导入
Posted
技术标签:
【中文标题】在旧项目中使用 vue 导入【英文标题】：import with vue in an old project 【发布时间】：2021-04-20 08:14:52 【问题描述】：我尝试用一些 vue 升级我的一些“旧项目”界面元素。
我的旧项目是一个没有框架的 php/html 项目。 我使用 vue-cli 对图表或网格的不同组件进行了一些测试。
现在我想将此组件集成到我的旧项目中，但组件的“导入”不起作用。
例如，在一个页面中，我需要一个 ag-grid，所以我得到了 ag grid vue。
但基本
import AgGridVue from 'ag-grid-vue';
不起作用，因为他无法获得“ag-grid-vue”。
它不是一个 vue 应用，它是来自 html 的 vue。
如果我使用 import AgGridVue from '/component/ag-grid-vue/main.js';，那就是“请求的模块 './component/ag-grid-vue/main.js' 不提供名为 'AgGridVue' 的导出”
如果我使用import AgGridVue from '/component/ag-grid-vue/main.js';，那就是“请求的模块 './component/ag-grid-vue/main.js' 不提供名为 'default' 的导出”
我不需要在我的不同页面中使用相同的组件。 所以问题是：如何导入我的 vue 组件？
【问题讨论】：
【参考方案1】：如果您在旧项目中没有使用 vue，那么您将无法使用它。或者，您可以使用Vue cdn，也可以使用ag Grid cdn。
https://www.jsdelivr.com/package/npm/@ag-grid-community/vue
html 文件
<body>
<div id="app">
<!-- I think you can put the component here -->
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@ag-grid-community/vue@25.0.0/main.min.js"></script>
<script>
var app = new Vue(
el: '#app',
data:
message: 'Hello Vue!'
)
</script>
您可以从这里探索更多。
【讨论】：
以上是关于在旧项目中使用 vue 导入的主要内容，如果未能解决你的问题，请参考以下文章
Babel 只编译我的 Vue 项目的 js 文件，而不是整个项目