Closed ctfrancia closed 6 years ago
nirodaonline
commented
5 years ago Quick fix:
Changed Home.vue:
import HelloWorld from '@/components/HelloWorld.vue'
to
import HelloWorld from '../components/HelloWorld.vue'
But there must be a better way.
gpgpublickey
commented
5 years ago this is still happening in last version, please reopen
haoqunjiang
commented
5 years ago @cristiangiagante Please provide more information and also check if it's the same issue as https://github.com/vuejs/vue-cli/issues/3243
patricio-ezequiel-hondagneu-roig
commented
5 years ago I'm having the same problem
thierryjacoel
commented
4 years ago If using webpack-bundle-tracker, you can add this line to your chainWebpack configuration:
config.resolve.alias.set('@', path.resolve(__dirname + '/src'));
Matthew-Benson
commented
3 years ago I am having the same problem but only within a multi-stage docker build and only when ran from a gitlab-runner. I have components under src/components/layout/{component} and I am importing them with import x from '@/components/layout/x' and the crazy thing that I can't pin down is that the build works on my machine and the build works on my machine using docker, but somehow the build does not work from the gitlab-runner doing the docker build. I cannot figure that one out but I'll put my config here for reference.
Dockerfile
# build stage
FROM node:12-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]babel.config.js
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset',
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
],
};vue.config.js
module.exports = {
css: {
loaderOptions: {
scss: {
prependData: '@import "~@/styles/variables.scss";',
},
},
},
};.eslintrc.js
module.exports = {
root: true,
env: {
node: true,
browser: true,
es2020: true,
},
extends: [
// add more generic rulesets here, such as:
// 'eslint:recommended',
'plugin:vue/essential',
'@vue/airbnb',
],
parserOptions: {
parser: 'babel-eslint',
},
rules: {
// override/add rules settings here, such as:
// 'vue/no-unused-vars': 'error'
'import/extensions': ['error', 'always', {
js: 'never',
vue: 'never',
}],
},
settings: {
'import/resolver': {
alias: {
map: [
['@', './src'],
],
extensions: ['.js', '.vue'],
},
},
},
overrides: [
{
files: [
'**/__tests__/*.{j,t}s?(x)',
'**/tests/unit/**/*.spec.{j,t}s?(x)',
],
env: {
mocha: true,
},
},
],
};
stefanhettich
commented
3 years ago @Matthew-Benson facing exactly the same problem like you! Local build (on windows machine) runs perfect. Build on GitLab CI Runner (inside kubernetes) fails, because of missing dependency. Changing from '@/components/...' to '../components/....' doesn't solve the problem.
Versions: Node: lts-alpine (14.15.4) @vue-cli-service: 4.5.10
Any hints or version downgrades which might solve this?
Matthew-Benson
commented
3 years ago @stefanhettich I'm so sorry! I did the classic bad-developer thing of solving my problem and not coming back to update what my solution was.
My issue was that I am using a case-insensitive file-system on MacOS - I named the folder in question @/components/Layout and then some commits later I realized the naming was weird and renamed the folder to @/components/layout and went about my merry day. A few days later when I was working on CI I ran into our crazy build issue. After hours of debugging I realized the folder in the kube runner was capital L Layout and not layout and because the directory layout could not be found the build failed!
I opened the repo in the gitlab editor and renamed the folder there to layout but you could also just do that in any case-sensitive system and commit it.
Changing the folder casing on my Mac never got committed and pushed up because the file system sees no difference.
Hope that helps!
stefanhettich
commented
3 years ago @Matthew-Benson Thank you so much for your response!
It was exactly the same thing in my case. I had several mixins like EnvService.ts and renamed them locally to envService.ts and git did not handle that, because Windows doesn't seem to be case-sensitive.
Nevertheless, the issue is fixed, you saved my day! Thanks a lot!
Version
3.0.5
Reproduction link
https://github.com/ctfrancia/shop
Node and OS info
npm 5.6.0
Steps to reproduce
vue serve
What is expected?
to show the application after running the command
What is actually happening?
This dependency was not found:
To install it, you can run: npm install --save @/components/HelloWorld.vue
I have uninstalled and reinstalled both vue and @vue/cli. updated npm and reinstalled. During installation errors are thrown:
ERROR Error: No files matching 'tests' were found.
Error: No files matching 'tests' were found.
-------- ALSO --------
apollo-link-persisted-queries@0.2.1 requires a peer of graphql@^0.11.0 || ^0.12.0 || ^0.13.0 but none is installed. You must install peer dependencies yourself.
npm WARN graphql-subscriptions@0.5.8 requires a peer of graphql@^0.10.5 || ^0.11.3 || ^0.12.0 || ^0.13.0 but none is installed. You must install peer dependencies yourself.
npm WARN graphql-subscriptions@0.5.8 requires a peer of graphql@^0.10.5 || ^0.11.3 || ^0.12.0 || ^0.13.0 but none is installed. You must install peer dependencies yourself.
npm WARN graphql-tools@3.1.1 requires a peer of graphql@^0.13.0 but none is installed. You must install peer dependencies yourself.
npm WARN @apollographql/apollo-upload-server@5.0.3 requires a peer of graphql@^0.13.1 but none is installed. You must install peer dependencies yourself.
This is a new bug and has never happened previously while starting a new project/running an old project.