运行页面控制台报错：Uncaught SyntaxError: Cannot use import statement outside a module

运行页面控制台报错：Uncaught SyntaxError: Cannot use import statement outside a module

原因：import $ from 'jquery'存在兼容性问题

解决办法：使用webpack

• webpack 安装：

  npm install webpack webpack-cli -D
  

• webpack配置：

  • 在项目根目录中，创建名为webpack.config.js的webpack配置文件，并初始化如下的基本配置:

    module.exports = {
        // 代表webpack运行的模式，可选值: development production
        mode: 'development'
    }
    

  • 在package.json的scripts节点下，新增dev脚本

    "scripts": {
        "dev": "webpack"
    },
    

  • 在终端中运行npm run dev

• 运行之后会生成dist/main.js，在index.html中引用这个js文件可以解决