Commit 99754c01 authored by Evan You's avatar Evan You

feat: css modules + hmr

parent 234d48b6
const hotReloadAPIPath = require.resolve('vue-hot-reload-api') const hotReloadAPIPath = require.resolve('vue-hot-reload-api')
exports.genHotReloadCode = (id, functional) => { exports.genHotReloadCode = (id, functional) => {
// TODO handle CSSModules and style injection disposal
return wrap(` return wrap(`
if (!module.hot.data) { if (!module.hot.data) {
api.createRecord('${id}', component.options) api.createRecord('${id}', component.options)
......
...@@ -74,7 +74,7 @@ module.exports = function (source) { ...@@ -74,7 +74,7 @@ module.exports = function (source) {
if (descriptor.template) { if (descriptor.template) {
const src = descriptor.template.src || resourcePath const src = descriptor.template.src || resourcePath
const langQuery = getLangQuery(descriptor.template) const langQuery = getLangQuery(descriptor.template)
const idQuery = hasScoped ? `&id=${id}` : `` const idQuery = `&id=${id}`
const fnQuery = hasFunctional ? `&functional` : `` const fnQuery = hasFunctional ? `&functional` : ``
const commentQuery = hasComment ? `&comment` : `` const commentQuery = hasComment ? `&comment` : ``
const query = `?vue&type=template${idQuery}${langQuery}${fnQuery}${commentQuery}` const query = `?vue&type=template${idQuery}${langQuery}${fnQuery}${commentQuery}`
......
...@@ -14,7 +14,7 @@ module.exports = function genStyleInjectionCode ( ...@@ -14,7 +14,7 @@ module.exports = function genStyleInjectionCode (
let styleInjectionCode = `` let styleInjectionCode = ``
let cssModulesHotReloadCode = `` let cssModulesHotReloadCode = ``
const hasCSSModules = false let hasCSSModules = false
const cssModuleNames = new Map() const cssModuleNames = new Map()
function genStyleRequest (style, i) { function genStyleRequest (style, i) {
...@@ -26,6 +26,8 @@ module.exports = function genStyleInjectionCode ( ...@@ -26,6 +26,8 @@ module.exports = function genStyleInjectionCode (
} }
function genCSSModulesCode (style, request, i) { function genCSSModulesCode (style, request, i) {
hasCSSModules = true
const moduleName = style.module === true ? '$style' : style.module const moduleName = style.module === true ? '$style' : style.module
if (cssModuleNames.has(moduleName)) { if (cssModuleNames.has(moduleName)) {
loaderContext.emitError(`CSS module name ${moduleName} is not unique!`) loaderContext.emitError(`CSS module name ${moduleName} is not unique!`)
......
...@@ -6,7 +6,8 @@ ...@@ -6,7 +6,8 @@
"scripts": { "scripts": {
"test": "jest --env node", "test": "jest --env node",
"lint": "eslint lib test --fix", "lint": "eslint lib test --fix",
"build": "webpack --config exploration/webpack.config.js" "build": "webpack --config exploration/webpack.config.js",
"dev": "webpack-dev-server --config exploration/webpack.config.js --inline --hot"
}, },
"author": "Evan You", "author": "Evan You",
"license": "MIT", "license": "MIT",
...@@ -31,6 +32,21 @@ ...@@ -31,6 +32,21 @@
"css-loader": "*", "css-loader": "*",
"vue-template-compiler": "^2.0.0" "vue-template-compiler": "^2.0.0"
}, },
"dependencies": {
"consolidate": "^0.15.0",
"debug": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"lru-cache": "^4.1.2",
"postcss": "^6.0.20",
"postcss-selector-parser": "^3.1.1",
"prettier": "^1.11.1",
"source-map": "^0.5.6",
"vue-component-compiler": "vuejs/vue-component-compiler#master",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0",
"vue-template-es2015-compiler": "^1.6.0"
},
"devDependencies": { "devDependencies": {
"babel-core": "^6.26.0", "babel-core": "^6.26.0",
"babel-loader": "^7.1.4", "babel-loader": "^7.1.4",
...@@ -61,20 +77,5 @@ ...@@ -61,20 +77,5 @@
"webpack-dev-server": "^3.1.1", "webpack-dev-server": "^3.1.1",
"webpack-merge": "^4.1.2", "webpack-merge": "^4.1.2",
"yorkie": "^1.0.3" "yorkie": "^1.0.3"
},
"dependencies": {
"consolidate": "^0.15.0",
"debug": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"lru-cache": "^4.1.2",
"postcss": "^6.0.20",
"postcss-selector-parser": "^3.1.1",
"prettier": "^1.11.1",
"source-map": "^0.5.6",
"vue-component-compiler": "vuejs/vue-component-compiler#master",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0",
"vue-template-es2015-compiler": "^1.6.0"
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment