webpack版本
"webpack": "^4.41.2",
"webpack-cli": "^3.3.10",
jsx文件
export default{
data(){
return{
headTitle:'顶部jsx head'
}
},
render(){
return(
<div id='header'>
<span>这是 {headTitle}</span>
</div>
)
}
}
配置loader
安装 jsx loader
npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props
Module build failed (from ./node_modules/_babel-loader@8.0.6@babel-loader/lib/index.js)
项目根目录下新建 .babelrc 文件
.babelrc 添加
{
"presets": ["@vue/babel-preset-jsx"]
}
最终版本:
"@babel/core": "^7.7.2",
"@babel/preset-env": "^7.7.1",
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
"@vue/babel-preset-jsx": "^1.1.2",
"babel-loader": "^8.0.6",
"webpack": "^4.41.2",
"webpack-cli": "^3.3.10",