vue运行报错解决思路

一、Vue版本不匹配问题的一种解决方法(Vue packages version mismatch:)

vue版本和vue-template-compiler 版本不一致

解决方法：

1.将 node_modules文件夹先删除

2.将package.json文件的 Vue版本号和 vue-template-compiler 版本号改为一致（2.6.7），选高的版本，重新进行npm run dev

二、npm run build 打包后字体文件路径报错 static/css/static/fonts 应为static/fonts

解决方式

步骤1：

找到build文件下的utils.js

ExtractTextPlugin.extract方法下

添加

publicPath: '../../' //解决路径报错

修改结果见图：

    // Extract CSS when that option is specified
    // (which is the case during production build)
    if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath: '../../'  //解决路径报错
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
  }

步骤2：

找到config文件夹下的index.js修改

build 的assetsPublicPath: '/',改为assetsPublicPath: './',

修改结果见图：

  build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',

    // you can set by youself according to actual condition
    assetsPublicPath: './',

三、vue 运行过程中报es6格式错误；

在目录下增加.babelrc文件

内容为： //transform-es2015-modules-commonjs 重点

内容为： //transform-es2015-modules-commonjs 重点
{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"],
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]
    }
  }
}

vue运行报错解决思路

猜你喜欢