美文网首页
vue-cli@3.0使用vue-cli-plugin-cube

vue-cli@3.0使用vue-cli-plugin-cube

作者: Circletan7 | 来源:发表于2019-07-08 21:45 被阅读0次

    报错信息:Cannot find module './cubeic.woff'
    These relative modules were not found:* ./cubeic.ttf in ./node_modules/css-loader??ref--11-oneOf-3-1!./node_modules/postcss-loader/src??ref--11-oneOf-3-2!./node_modules/stylus-loader??ref--11-oneOf-3-3!./node_modules/cube-ui/src/common/stylus/index.styl* ./cubeic.woff in ./node_modules/css-loader??ref--11-oneOf-3-1!./node_modules/postcss-loader/src??ref--11-oneOf-3-2!./node_modules/stylus-loader??ref--11-oneOf-3-3!./node_modules/cube-ui/src/common/stylus/inde

    原来,安装cube-ui之后还要配置一下相关文件才能使用,我使用的是后编译,按需引入部分组件,按照下面配置就成功了,其他情况可参考[vue-cli@3.0] 如何搭配使用 - GitHub

    vue.config.js 文件:

    const PostCompilePlugin = require('webpack-post-compile-plugin')
    const TransformModulesPlugin = require('webpack-transform-modules-plugin')
    
    module.exports = {
      chainWebpack: config => {
        const conf = config.toConfig()
        config
          .plugin('post-compile')
          .use(PostCompilePlugin, [{
            config: {
              module: {
                rules: [...conf.module.rules]
              }
            }
          }])
          .end()
          .plugin('transform-modules')
          .use(TransformModulesPlugin)
      },
      css: {
        loaderOptions: {
          stylus: {
            'resolve url': true
            // 自定义主题场景
            // import: [path.resolve(__dirname, './src/theme')]
          }
        }
      }
    }

    相关文章

      网友评论

          本文标题:vue-cli@3.0使用vue-cli-plugin-cube

          本文链接:https://www.haomeiwen.com/subject/xhlzhctx.html