vuejs / babel-plugin-transform-vue-jsx

babel plugin for vue 2.0 jsx
1.85k stars 132 forks source link

it not work with webpack4 + babel7 #160

Closed panct closed 5 years ago

panct commented 5 years ago

image

xiaofan9 commented 5 years ago

npm install babel-plugin-transform-vue-jsx@4.0.1 @babel/helper-module-imports @babel/plugin-syntax-jsx babel-helper-vue-jsx-merge-props --save-dev

panct commented 5 years ago

ok, i will try to install, thx!

panct commented 5 years ago

image image

i have installed that you said,but it not work,can you let me see your package.json and .babelrc?

panct commented 5 years ago

image this is setting that author write,how i use it?

panct commented 5 years ago

我这个之前用webpack1.x + babel6.x的版本配置,但是升级之后就遇到问题了,没法解析vue的jsx语法的组件了

panct commented 5 years ago

好的,我再试一次

panct commented 5 years ago

还是不行

lynnic26 commented 5 years ago

有后续么,我也用不了

xiaofan9 commented 5 years ago

我这边就是装了那些包就好了

zhaoYun-Long commented 5 years ago

我也是运行不了,升级后就会有bug

himself65 commented 5 years ago

我也是

himself65 commented 5 years ago

最近我找到了一个配置方法

My repo

babel.config.js

module.exports = {
  plugins: [
    "@babel/plugin-transform-runtime",
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-proposal-object-rest-spread",
    "transform-vue-jsx"
  ],
  env: {
    build: {
      presets: [
        "@vue/app"
      ]
    },
    test: {
      presets: [
        [
          "@babel/env",
          {
            "targets": {
              "node": "current"
            },
          },
        ]
      ]
    }
  }
}

backage.json

 "devDependencies": {
    "@babel/cli": "^7.1.5",
    "@babel/core": "^7.1.6",
    "@babel/plugin-proposal-export-namespace-from": "^7.0.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@types/jest": "^23.3.9",
    "@types/node": "^10.11.3",
    "@types/vue": "^2.0.0",
    "@vue/cli-plugin-babel": "^3.1.1",
    "@vue/cli-plugin-eslint": "^3.1.5",
    "@vue/cli-plugin-unit-jest": "^3.1.1",
    "@vue/cli-service": "^3.1.4",
    "@vue/test-utils": "^1.0.0-beta.26",
    "avoriaz": "^6.3.0",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-jest": "^23.6.0",
    "babel-loader": "^8.0.4",
    "babel-plugin-module-resolver": "^3.1.1",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-vue-jsx": "^3.7.0",
    "babel-polyfill": "^6.26.0",
    "concurrently": "^4.1.0",
    "coverage": "^0.0.0",
    "cross-env": "^5.2.0",
    "eslint": "^5.6.1",
    "eslint-config-standard": "^12.0.0",
    "eslint-import-resolver-babel-module": "^4.0.0",
    "eslint-loader": "^2.1.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-node": "^7.0.1",
    "eslint-plugin-promise": "^4.0.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^4.7.1",
    "jest": "^23.6.0",
    "jest-css-modules": "^1.1.0",
    "jest-serializer-vue": "^2.0.2",
    "regenerator-runtime": "^0.13.1",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "tslint": "^5.11.0",
    "tslint-config-standard": "^8.0.1",
    "typescript": "^3.1.1",
    "vue": "^2.5.17",
    "vue-router": "^3.0.1",
    "vue-template-compiler": "^2.5.17",
    "vuepress": "^0.14.5"
  }

不知道对你们有没有什么帮助

NE-SmallTown commented 5 years ago

Any update on this?

gromimiss commented 5 years ago

请问之后解决了吗

molten-firescar96 commented 5 years ago

I had success using version 4 of this library. The README suggests using version 4. npm install --save-dev @babel/plugin-syntax-jsx babel-plugin-transform-vue-jsx@4

my .babelrc

{
  "presets": [
    ["@babel/preset-env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
  ],
  "plugins": [
    "transform-vue-jsx", "@babel/plugin-transform-runtime", ["@babel/plugin-proposal-decorators", { "legacy": true }],
    "@babel/plugin-syntax-dynamic-import"
  ], "env": {
    "test": {
      "plugins": ["istanbul"]
    }
  }
}

relevant section of package.json

    "@babel/core": "^7.4.5",
    "@babel/plugin-proposal-decorators": "^7.4.4",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-syntax-jsx": "^7.2.0",
    "@babel/plugin-transform-runtime": "^7.4.4",
    "autoprefixer": "^7.1.2",
    "babel-eslint": "^8.2.1",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-loader": "^8.0.6",
    "babel-plugin-istanbul": "^5.1.1",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-plugin-transform-vue-jsx": "^4.0.1",
    "babel-preset-stage-2": "^6.22.0",
nickmessing commented 5 years ago

Please use this preset for babel 6: https://github.com/vuejs/jsx