账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    webpack中的externals无效是怎么回事？
    51
    0

    我用vue-cli 全家桶开发的项目，后来看vendor.js太大了，就想把一些公共的框架提取出来，不再打包，而是直接script引入

    index.html中

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
<div id="app"></div>
<script src="/static/assets/moment.min.js"></script>
<script src="/static/assets/vue.min.js"></script>
<script src="/static/assets/vuex.min.js"></script>
<script src="/static/assets/vue-router.min.js"></script>
<script src="/static/assets/vue-i18n.min.js"></script>
<script src="/static/assets/axios.min.js"></script>
<script src="/static/assets/bignumber.min.js"></script>

<!-- built files will be auto injected -->
</body>
</html>

    /build/webpack.base.conf.js

    module.exports = {
    externals: {
        'vue': 'Vue',
        'vue-router': 'VueRouter',
        'vue-i18n': 'VueI18n',
        'moment': 'moment',
        'axios': 'axios',
        'vuex': 'Vuex',
        'bignumber.js': 'BigNumber'
    }
}

    但是通过npm run build 之后，还是打包再一起了。

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得：提问者悬赏的 11 元积分
        全部回答
    • 共 0 条
    • ━╋う一瞬間旳綻放╰☆╮ 普通会员 1楼

      在webpack中，externals是一个全局对象，它用于定义外部模块的名称，如require和import。

      externals无效的原因可能有以下几点：

      1. 函数名写错： externals可以使用函数名，但函数名不能以数字开头，如果函数名以数字开头，需要将其改为驼峰命名法（如 require('module')）。

      2. 类名写错： externals可以使用类名，但类名不能以数字开头，如果类名以数字开头，需要将其改为驼峰命名法（如 require('module').Class）。

      3. 模块未加载：如果你试图使用一个未加载的模块，webpack会抛出一个错误。

      4. 链接问题：如果你在一个模块的import语句中使用了外部模块，但在另一个模块的require语句中未使用，那么这个模块的import语句就会被忽略，因为externals并没有将这个模块添加到全局对象中。

      解决externals无效的问题，你可以尝试以下方法：

      1. 检查函数名、类名和模块名是否正确。

      2. 确保所有的模块都已经加载到全局对象中。

      3. 检查所有的import语句是否正确，包括在外部模块的import语句中。

      4. 如果可能，尝试使用require('module').Class替代require('module')。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部