javascript - Vue cli 删除脚本注入(inject)

标签 javascript wordpress vue.js vue-cli

我在 WordPress 中使用 vue cli。 Wordpress 有它自己的向 DOM 添加脚本的方法。因此,我不需要 vue cli 将脚本添加到最终的 index.html 文件。当我运行 npm run build 时,我得到如下信息:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="/favicon.ico">
    <title>my-app</title>
  <link href="/js/app.js" rel="preload" as="script"><link href="/js/chunk-vendors.js" rel="preload" as="script"></head>
  <body>
    <noscript>
      <strong>We're sorry but my-app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  <script type="text/javascript" src="/js/chunk-vendors.js"></script><script type="text/javascript" src="/js/app.js"></script></body>
</html>

我希望在运行构建时不要注入(inject)标签和 css。发生的情况是,当 html 文件运行时,我收到一堆 404 错误。因此,如果有一种方法可以完全停止注入(inject),但仍然构建实际的捆绑文件,那就太好了。

最佳答案

您可以通过在HTML Webpack Plugin中禁用注入(inject)来做到这一点选项。将以下内容添加到您的 vue.config.js 文件中。

  chainWebpack: (config) => {
    config.plugin('html').tap((args) => {
      args[0].inject = false

      return args
    })
  }

关于javascript - Vue cli 删除脚本注入(inject),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65361905/

相关文章:

javascript - Cakephp 2.x - 隐藏/显示组合框

php - 如何使用 PHP 和 jQuery 创建动态类

php - $_FILES 结帐时为空

WordPress HTTP 请求 501 内部服务器错误

laravel - 如果 jwt token 在 laravel 和 Vue spa 中使用 httponly 存储在 cookie 中,如何防止 csrf 攻击?

javascript - 使用 vue.js 动态设置 v-for

javascript - 如何在vuejs中追加多行

javascript - JavaScript 可以与 CSS 交互吗?

javascript - Jquery 延迟滚动到#ID

javascript - 通过 Javascript 根据内容更改元素 css