将CLI生成的Vue项目组件添加到旧项目

时间:2019-09-23 20:40:14

标签: vue.js vue-cli vue-cli-3

我的旧项目的模板在返回浏览器之前在服务器端呈现。我有一个由vue create [project_name]创建的脚手架项目。我想将这个脚手架项目的组件包括到我的旧项目中。

我假设我可以从旧版dist/app.js链接到index.html构建,但是这不能按预期进行:

旧版 index.html

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="/path/to/app.12345.js"></script>
<body>
    <div id="app">
        <MyComponent></MyComponent>
    </div>
</body>

有人建议我可能要在library mode中进行构建,因此,我尝试了这种方法。库构建输出以下文件:

  1. dist / myLib.umd.min.js
  2. dist / myLib.umd.js
  3. dist / myLib.common.js
  4. dist / myLib.css

我的假设是包括这些文件,并且它将按预期工作。但是:

  • 包含myLib.common.js文件会向控制台返回错误:Uncaught ReferenceError: module is not defined at app.common.js
  • 包含dist/myLib.umd.js不会显示任何呈现的变化— <MyComponent></MyComponent>组件仍呈现为<MyComponent></MyComponent>

0 个答案:

没有答案