vue打包后jquery is not defined和静态资源路径找不到

最新推荐文章于 2025-03-24 15:01:43 发布

ruby_xc

最新推荐文章于 2025-03-24 15:01:43 发布

阅读量3k

点赞数

分类专栏：前端学习文章标签： webpack vue

本文链接：https://blog.csdn.net/ruby_xc/article/details/79306020

版权

前端学习专栏收录该内容

37 篇文章

订阅专栏

本文介绍如何解决Webpack项目中出现的'jQuery is not defined'错误及静态资源路径不可达的问题。通过调整配置文件，将jQuery加入全局变量并修改静态资源的公共路径为相对路径。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、jquery is not defined:

解决：

webpack.prod.conf.js:

new webpack.DefinePlugin({
      'process.env': env,
      $ : 'jquery',
      jQuery : 'jquery'
    }),

改为：

new webpack.ProvidePlugin({
           $: "jquery",
           jQuery: "jquery"
    }),

2、静态资源路径找不到

解决：

config > index.js:

build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    productionSourceMap: true,
    ...
}

改为：

build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',
    productionSourceMap: true,
    ...
}

把绝对路径改为相对路径