美文网首页
[mark] vue-jsx 配置

[mark] vue-jsx 配置

作者: Bboy_2016 | 来源:发表于2018-06-06 21:02 被阅读40次
    可能有些同学会想在 vue 项目中去实现 jsx 的写法,正巧我之前在项目中引入过 jsx。于是便想要贴出来,以作为记录。
    
    我的项目是 vue 基于 weback 编译打包的,是通过 vue-cli 这样一个脚手架去搭建的,且 vue-cli 的项目版本是 2.x.x,webpack 的版本也是 2.x.x。
    

    文件参考:babel-plugin-transform-vue-jsx

    代码如下:

    // package.json
    // 添加安装包(--save-dev,安装到开发依赖里)
        "babel-plugin-transform-vue-jsx": "^3.5.0",
        "babel-preset-env": "^1.6.1",
        "babel-helper-vue-jsx-merge-props": "^2.0.3",
        "babel-plugin-syntax-jsx": "^6.18.0",
    
    // ./.babelrc
    // 在 plugins 中添加 "transform-vue-jsx",目的是在 babel 中转义。
      "plugins": ["transform-vue-jsx", ["transform-runtime"], ["component", [
        {
          "libraryName": "element-ui",
          "styleLibraryName": "theme-chalk"
        }
      ]]]
    
    

    相关文章

      网友评论

          本文标题:[mark] vue-jsx 配置

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