Last active
March 8, 2024 17:43
-
-
Save yyx990803/e0f4f1275841f4ce756b8c1ac1db76e9 to your computer and use it in GitHub Desktop.
vue-loader 15.0 usage
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This requires the WIP branch at https://github.com/vuejs/vue-loader/tree/next | |
const path = require('path') | |
const { VueLoaderPlugin } = require('vue-loader') | |
module.exports = { | |
mode: 'development', | |
entry: path.resolve(__dirname, './main.js'), | |
output: { | |
path: path.resolve(__dirname, 'dist') | |
}, | |
module: { | |
rules: [ | |
{ | |
test: /\.vue$/, | |
loader: 'vue-loader' | |
}, | |
// this will apply to both plain .js files | |
// AND <script> blocks in vue files | |
{ | |
test: /\.js$/, | |
loader: 'babel-loader' | |
}, | |
// this will apply to both plain .css files | |
// AND <style> blocks in vue files | |
{ | |
test: /\.css$/, | |
use: [ | |
'vue-style-loader', | |
'css-loader' | |
] | |
}, | |
// this will apply to both plain .scss files | |
// AND <style lang="scss"> blocks in vue files | |
{ | |
test: /\.scss$/, | |
use: [ | |
'vue-style-loader', | |
'css-loader', | |
{ | |
loader: 'sass-loader', | |
options: { | |
data: '$color: red;' | |
} | |
} | |
] | |
} | |
] | |
}, | |
plugins: [ | |
// make sure to include the plugin for the magic | |
new VueLoaderPlugin() | |
] | |
} |
Should have read the breaking changes for vue-loader 15...thanks thought 👍
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
i like it -_-