vuecli2 升级到vuecli4,打包报错

发布于 2022-09-12 13:01:21 字数 2146 浏览 21 评论 0

项目由 vue-cli2.x 创建,目前打算升级到 @vue/cli 4,把老项目中所有文件拷贝过来,然后修改下 loader 的配置;npm run serve 运行后错误如下,实在是找不到原因了,高的头痛了;

image

补充 web.config.js 文件内容

const path = require('path');
const webpack = require('webpack')
require ('babel-polyfill')




function resolve (dir) {
  let result = path.join(__dirname, dir)
  // console.log(result);
  return result
}

function assetsPath (_path) {
  // let result = path.posix.join('public', _path)
  let result = path.posix.join('public', _path)
console.log(result);
  return result
}

module.exports = {

  configureWebpack: {
    resolve: {
      alias: {
        '@': resolve('src')
      },
      extensions: ['.js', '.vue', '.json'],
    }
  },
  lintOnSave: false,
  chainWebpack: config => {
    config.plugin('provide').use(webpack.ProvidePlugin, [{
      $: 'jquery',
      jquery: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery'
    }])


    config.module.rules.delete("svg"); //重点:删除默认配置中处理svg
    config.module
        .rule('svg-smart')
        .test(/\.svg$/)
        .include
        .add(resolve('src/icons')) //处理svg目录
        .end()
        .use('svg-sprite-loader')
        .loader('svg-sprite-loader')
        .options({
            symbolId: 'icon-[name]'
        })

    config.module
    .rule('url-loader')
    .test(/\.(png|jpe?g|gif|svg)(\?.*)?$/)
    .exclude
    .add(resolve('src/icons')) //处理svg目录
    .end()
    .use('url-loader')
    .loader('url-loader')
    .options({
      limit: 10000,
      name: assetsPath('img/[name].[hash:7].[ext]')
    })

    config.module
    .rule('js')
    .test(/\.js$/)
    .include
    .add(resolve('src'))
    .add(resolve('test'))
    .add(resolve('node_modules/webpack-dev-server/client'))
    .end()
    .use('babel-loader')
    .loader('babel-loader')

    config.module
    .rule('media')
    .test(/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/)
    .use('url-loader')
    .loader('url-loader')
    .options({
      limit: 10000,
      name: assetsPath('media/[name].[hash:7].[ext]')
    })
  


  }
};

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

辞取 2022-09-19 13:01:21

卸载重装可以的

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文