在Vue中加入JSX的做法是，首先需要安裝相應(yīng)的依賴(lài)包。例如你需要使用Vue的JSX語(yǔ)法，則需要安裝“babel-plugin-transform-vue-jsx”這個(gè)插件。

npm install --save-dev babel-plugin-transform-vue-jsx

另外需要安裝“babel-preset-env”和“vue-template-compiler”這兩個(gè)插件：

npm install --save-dev babel-preset-env vue-template-compiler

然后在配置文件.babelrc中添加以下內(nèi)容：

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

這樣，就可以在Vue項(xiàng)目中使用JSX了。例如：

import Vue from 'vue'
Vue.component('my-component', {
props: ['msg'],
render(h) {
return
{this.msg}
}
})

如上述代碼所示，在Vue組件中使用了JSX語(yǔ)法，利用render函數(shù)返回JSX代碼生成組件DOM結(jié)構(gòu)。

當(dāng)然，你也可以使用Vue提供的“vue-loader”來(lái)使用JSX。首先，需要安裝“vue-loader”和“vue-template-compiler”這兩個(gè)插件：

npm install --save-dev vue-loader vue-template-compiler

然后在webpack配置文件中，添加如下的loader：

module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
jsx: 'babel-loader?plugins[]=transform-vue-jsx'
}
}
},
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
}
]
}

這樣，就可以在.vue文件中使用JSX了。例如：

如上述代碼所示，利用render函數(shù)生成組件DOM結(jié)構(gòu)，在模板中通過(guò)jsx語(yǔ)法引用組件。

總結(jié)，使用Vue進(jìn)行開(kāi)發(fā)時(shí)，如果需要使用JSX，則需要安裝相應(yīng)的依賴(lài)包，并進(jìn)行配置。可以通過(guò)手動(dòng)添加配置文件的方式，也可以使用“vue-loader”實(shí)現(xiàn)。