webpack 实现异步加载 JS
懒加载,其实 webpack 环境支持的
// 引入动态数据 - 懒加载
setTimeout(()=>{
// 回顾 vue React 异步组件,其实 webpack 环境支持的
// 定义 chunk
import('./dynamic-data.js').then(res=>{
console.log(res.default.message) // 注意这里的 default
})
},1500)
处理 React 的 JSX 使用
npm install --save-dev @babel/preset-react
然后配置 .babelrc 文件
{
"presets": ["@babel/preset-react"]
}
处理 Vue 文件,则使用 vue-loader
npm install -D vue-loader vue-template-compiler
然后配置 webpack.common.js 文件
{
module: {
rules: [
{
test: /\.vue$/,
loader: ['vue-loader'],
include: srcPath
},
]
},
}