在vue项目中写jsx语法,需要webpack支持

配置JSX

babel-plugin-transform-vue-jsx

JSX是需要编译为JavaScript才可以运行的, 所以第三个样例需要有额外的编译步骤。这里我们用Babel和Webpack来进行编译。

打开你的webpack.config.js文件, 加入babel loader:

loaders: [
  { test: /\.js$/, loader: 'babel', exclude: /node_modules/ }
]

新建或者修改你的.babelrc文件,加入 babel-plugin-transform-vue-jsx 这个插件

{
  "presets": ["es2015"],
  "plugins": ["transform-vue-jsx"]
}

现在运行webpack, 代码里面的JSX就会被正确的编译为标准的JavaScript代码。(我用的是第二种方法)

猜你喜欢

转载自blog.csdn.net/w1019945543/article/details/79565247