使用vue-cli3创建项目,踩坑记录

vue-cli3是个好东西,但是好东西也有不完美的地方。
在使用的过程中,遇到了一些莫名其妙或因姿势不对出现的error,在这里记录下来。也算是前人栽树,后人乘凉。

设置别名 alias 的注意事项

在根目录新建vue.config.js

const path = require("path");

function resolve(dir) {
  return path.join(__dirname, dir);
}
module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        "@": resolve("src")
      }
    }
  }
};
复制代码

App.vue文件中使用@别名

import HelloWorld from "@/components/HelloWorld";
复制代码

编译后终端报错如下:

 ERROR  Failed to compile with 1 errors                                                                                                                                                                20:49:36

 error  in ./src/App.vue

Module Error (from ./node_modules/eslint-loader/index.js):
error: Missing file extension for "@/components/HelloWorld" (import/extensions) at src/App.vue:11:24:
   9 |
  10 | 
                    
                    

你可能感兴趣的:(使用vue-cli3创建项目,踩坑记录)