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
            },
        ]
    },
}

标签: 无

评论已关闭