Vue的官网中提到了有关异步组件的语法，链接如下：
https://cn.vuejs.org/v2/guide/components-dynamic-async.html
可以使用require，也可以使用import，如果使用import，那么语法是这样的。

new Vue({
  // ...
  components: {
    'my-component': () => import('./my-async-component')
这里的关键就是()=>import(’./my-async-component’)这一句，import函数会返回一个Promise，从而达到异步加载的效果。然后如果你和我一样是启用了ESLint的vue CLI项目的话，那么这样写就会得到一个报错，即：
 import’ and ‘export’ may only appear at the top level。
 意思是import和export没有放到全局（顶层块作用域），如果你使用的是require，那么应该也会报类似的错误，这里就不在探究，因为import和require在vue CLI项目中的作用是类似的。接下来我说说怎么解决，还有解决的思路。
 
通过报错信息我们不难看出，这一句报错实际上是ESLint的报错，我们写的代码从语法上根本没有任何问题，因此我们只需要在EsLint的配置文件中将响应的验证规则禁用即可，最终我在ESLint官网的文档中找到了这个。
 https://eslint.bootcss.com/docs/rules/global-require
 解决步骤是在Vue项目根目录中打开.eslintrc.js，在导出的设置的rules中，加上~~“global-require”: false"~~ global-require": 0 。之后关闭并重新编译或热部署vue应用就可以了。
 .eslintrc.js的内容如下：
 
//这是.eslintrc.js里面的内容，如果项目中不包含这个文件可以新建一个
module.exports = {
    "env": {
        "browser": true,
        "es6": true,
        "node": true,
        "browser": true
    "extends": [
        "eslint:recommended",
        "plugin:vue/essential"
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module"
    "plugins": [
        "vue"
    ],//其他的设置都是自动的
    "rules": {
    	//就是这一句，禁用import和require必须出现在顶层作用域的验证规则
        "global-require": 0//这里应该0代表off之前写错了写成了false
在ESLint的配置文件中，我们在rules字段配置需要开启或者关闭的验证规则，ESlint所有可配置的规则在官网文档中列举如下：https://eslint.bootcss.com/docs/rules/。
 如果你还希望禁用一些与vue文件相关的配置（例如去掉v-for的key验证），可以参考这个官网文档，https://eslint.vuejs.org/rules/。
import('@/vendor/Export2Excel').then(excel => {
  	const tHeader = ['雇员编号', '姓名', '年龄', '性别', '生日', '身份证', '电话', 			'QQ', '地址', '入职时间', '状态']
        const filterVal = ['empNo', 'empName', 'empAge', 'empSex', 'empBirthday', 'empIdCard', 'empTel', 
                                    今天new了一个项目，在搭建新的vue项目，其中引入了部分依赖，在run的过程中出现了以下报错信息：
Parsing error: 'import' and 'export' may appear only with 'sourceType: module'
解决方法如下：
找到项目的.eslintrc.js文件，在parserOptions增加以下代码，重新编译即可。
 parserOptions: {
    sourceType: 'module'
报错代码
document.querySelector('#btn').onclick = function () {
  import(/* webpackChunkName: 'test' */'./print')
    .then(({ print }) => {
      console.log(print(2, 3));
地址见：https://github.com/webpack/webpack/issues/8656
Module parse failed: 'import' and 'export' may only appear at the top level (85:8)
You may need an appropriate loade...
                                    在搭建React开发环境是使用react-hot-loader时出现了import' and 'export' may only appear at the top level错误，当时考虑到使用的版本存在问题，通过官方git发现如下办法解决；
解决办法：
If you're using React Hot Loader together with Babel (ex
 6to5), mak
//通常情况下只有一个，所有路由配置的页面会在这里展示，通常放在App.vue中
1.2路由链接
 <router-link to="路由路径"  >名称A</router-link>
//通过router-link点击"名称A"可以进入路由界面
1.3子组件
这个方式么，是属于你的一部分，不用点击都能看到．不过在用之前得声明下．
(1)局部的话就
<SingleUpload v-model="dataForm.
                                    react 中使用import()实现按需加载报错 解决方法 --‘import’ and ‘export’ may only appear at the top level