Skip to content

Remove deprecated cache-loader #6634

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: dev
Choose a base branch
from
Open

Remove deprecated cache-loader #6634

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions packages/@vue/cli-plugin-typescript/__tests__/tsPluginBabel.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,8 @@ test('using correct loader', async () => {
const config = service.resolveWebpackConfig()
// eslint-disable-next-line no-shadow
const rule = config.module.rules.find(rule => rule.test.test('foo.ts'))
expect(rule.use[0].loader).toMatch(require.resolve('cache-loader'))
expect(rule.use[1].loader).toMatch(require.resolve('babel-loader'))
expect(rule.use[2].loader).toMatch(require.resolve('ts-loader'))
expect(rule.use[0].loader).toMatch(require.resolve('babel-loader'))
expect(rule.use[1].loader).toMatch(require.resolve('ts-loader'))
})

const creatorOptions = {
Expand Down
10 changes: 0 additions & 10 deletions packages/@vue/cli-plugin-typescript/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,16 +30,6 @@ module.exports = (api, projectOptions) => {
tsxRule.use(name).loader(loader).options(options)
}

addLoader({
name: 'cache-loader',
loader: require.resolve('cache-loader'),
options: api.genCacheConfig('ts-loader', {
'ts-loader': require('ts-loader/package.json').version,
'typescript': require('typescript/package.json').version,
modern: !!process.env.VUE_CLI_MODERN_BUILD
}, 'tsconfig.json')
})

if (useThreads) {
addLoader({
name: 'thread-loader',
Expand Down
1 change: 0 additions & 1 deletion packages/@vue/cli-plugin-typescript/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@
"@types/webpack-env": "^1.15.2",
"@vue/cli-shared-utils": "^5.0.0-beta.3",
"babel-loader": "^8.2.2",
"cache-loader": "^4.1.0",
"fork-ts-checker-webpack-plugin": "^6.1.0",
"globby": "^11.0.2",
"thread-loader": "^3.0.0",
Expand Down
25 changes: 4 additions & 21 deletions packages/@vue/cli-service/lib/config/base.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,9 @@ module.exports = (api, options) => {
.rule('esm')
.test(/\.m?jsx?$/)
.resolve.set('fullySpecified', false)

webpackConfig
.cache({ type: 'filesystem' })
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't do this. It's not safe. I'm pretty sure it'll fail at least one of these test cases:
https://github.com/sodatea/vue-cli/blob/e3cfcf57a30bb58ccc7895fe1d3242fcef797501/packages/%40vue/cli-service/__tests__/cache.spec.js#L32-L61

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the feedback! I appreciate it.

It's not explicitly stated in the documentation, but the spec for caching in webpack 5 states:

Each build with a different webpack configuration should store a unique copy of its cache versus another webpack configuration. E.g. A development build and a production build must have distinct caches due to them having different options set.

The spec for it is here: webpack/webpack#6527

I'm not sure how the --mode option works in vue-cli, but it does look like those specific tests did not fail for this PR. You can see the reports for those here: https://app.circleci.com/pipelines/github/vuejs/vue-cli/1124/workflows/10aeafe8-27a2-486a-9609-2111481209be/jobs/27240

The only two tests that failed do not seem to be related to the changes I made.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The link points to another PR that I'm working on.
The tests are not written yet, therefore it's not in the pipeline.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The only two tests that failed do not seem to be related to the changes I made.

I'm afraid they're related. Looks like the build process for modern mode reused the cache from the legacy mode.

}

webpackConfig
Expand Down Expand Up @@ -57,12 +60,6 @@ module.exports = (api, options) => {
// vue-loader --------------------------------------------------------------
if (vueMajor === 2) {
// for Vue 2 projects
const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', {
'vue-loader': require('@vue/vue-loader-v15/package.json').version,
'@vue/component-compiler-utils': require('@vue/component-compiler-utils/package.json').version,
'vue-template-compiler': require('vue-template-compiler/package.json').version
})

webpackConfig.resolve
.alias
.set(
Expand All @@ -75,17 +72,13 @@ module.exports = (api, options) => {
webpackConfig.module
.rule('vue')
.test(/\.vue$/)
.use('cache-loader')
.loader(require.resolve('cache-loader'))
.options(vueLoaderCacheConfig)
.end()
.use('vue-loader')
.loader(require.resolve('@vue/vue-loader-v15'))
.options(Object.assign({
compilerOptions: {
whitespace: 'condense'
}
}, vueLoaderCacheConfig))
}))

webpackConfig
.plugin('vue-loader')
Expand All @@ -101,11 +94,6 @@ module.exports = (api, options) => {
.prepend(path.resolve(__dirname, './vue-loader-v15-resolve-compat'))
} else if (vueMajor === 3) {
// for Vue 3 projects
const vueLoaderCacheConfig = api.genCacheConfig('vue-loader', {
'vue-loader': require('vue-loader/package.json').version,
'@vue/compiler-sfc': require('@vue/compiler-sfc/package.json').version
})

webpackConfig.resolve
.alias
.set(
Expand All @@ -118,14 +106,9 @@ module.exports = (api, options) => {
webpackConfig.module
.rule('vue')
.test(/\.vue$/)
.use('cache-loader')
.loader(require.resolve('cache-loader'))
.options(vueLoaderCacheConfig)
.end()
.use('vue-loader')
.loader(require.resolve('vue-loader'))
.options({
...vueLoaderCacheConfig,
babelParserPlugins: ['jsx', 'classProperties', 'decorators-legacy']
})
.end()
Expand Down
1 change: 0 additions & 1 deletion packages/@vue/cli-service/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,6 @@
"address": "^1.1.2",
"autoprefixer": "^10.2.4",
"browserslist": "^4.16.3",
"cache-loader": "^4.1.0",
"case-sensitive-paths-webpack-plugin": "^2.3.0",
"cli-highlight": "^2.1.10",
"clipboardy": "^2.3.0",
Expand Down