├── .babelrc
├── .editorconfig
├── .gitignore
├── .postcssrc.js
├── build
├── build.js
├── check-versions.js
├── dev-client.js
├── dev-server.js
├── utils.js
├── vue-loader.conf.js
├── webpack.base.conf.js
├── webpack.dev.conf.js
├── webpack.prod.conf.js
└── webpack.test.conf.js
├── config
├── dev.env.js
├── index.js
├── prod.env.js
└── test.env.js
├── data.json
├── goods.json
├── index.html
├── new_vue_cli(解决dev-ser丢失)
├── .babelrc
├── .editorconfig
├── .gitignore
├── .postcssrc.js
├── README.md
├── build
│ ├── build.js
│ ├── check-versions.js
│ ├── logo.png
│ ├── utils.js
│ ├── vue-loader.conf.js
│ ├── webpack.base.conf.js
│ ├── webpack.dev.conf.js
│ ├── webpack.prod.conf.js
│ └── webpack.test.conf.js
├── config
│ ├── dev.env.js
│ ├── index.js
│ ├── prod.env.js
│ └── test.env.js
├── goods.json
├── index.html
├── package.json
├── server
│ ├── package.json
│ └── static
│ │ ├── config.js
│ │ ├── db.json
│ │ └── server.js
├── src
│ ├── App.vue
│ ├── assets
│ │ └── logo.png
│ ├── components
│ │ └── HelloWorld.vue
│ ├── main.js
│ └── router
│ │ └── index.js
├── static
│ └── .gitkeep
└── test
│ ├── e2e
│ ├── custom-assertions
│ │ └── elementCount.js
│ ├── nightwatch.conf.js
│ ├── runner.js
│ └── specs
│ │ └── test.js
│ └── unit
│ ├── .eslintrc
│ ├── jest.conf.js
│ ├── setup.js
│ └── specs
│ └── HelloWorld.spec.js
├── package.json
├── readme.txt
├── src
├── assets
│ └── image
│ │ ├── 54205424_big.jpg
│ │ └── noimg.png
├── components
│ ├── DetailHeader.vue
│ ├── Message.vue
│ ├── commonFooter.vue
│ ├── homeHeader.vue
│ └── list.vue
├── main.js
├── pages
│ ├── goodsDetail.vue
│ └── home.vue
└── router
│ └── index.js
├── static
└── .gitkeep
└── test
├── e2e
├── custom-assertions
│ └── elementCount.js
├── nightwatch.conf.js
├── runner.js
└── specs
│ └── test.js
└── unit
├── .eslintrc
├── index.js
├── karma.conf.js
└── specs
└── Hello.spec.js
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | ["latest", {
4 | "es2015": { "modules": false }
5 | }],
6 | "stage-2"
7 | ],
8 | "plugins": ["transform-runtime"],
9 | "comments": false,
10 | "env": {
11 | "test": {
12 | "presets": ["latest", "stage-2"],
13 | "plugins": [ "istanbul" ]
14 | }
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | root = true
2 |
3 | [*]
4 | charset = utf-8
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules/
3 | dist/
4 | npm-debug.log
5 | yarn-error.log
6 | test/unit/coverage
7 | test/e2e/reports
8 | selenium-debug.log
9 |
--------------------------------------------------------------------------------
/.postcssrc.js:
--------------------------------------------------------------------------------
1 | // https://github.com/michael-ciniawsky/postcss-load-config
2 |
3 | module.exports = {
4 | "plugins": {
5 | // to edit target browsers: use "browserlist" field in package.json
6 | "autoprefixer": {}
7 | }
8 | }
9 |
--------------------------------------------------------------------------------
/build/build.js:
--------------------------------------------------------------------------------
1 | require('./check-versions')()
2 |
3 | process.env.NODE_ENV = 'production'
4 |
5 | var ora = require('ora')
6 | var rm = require('rimraf')
7 | var path = require('path')
8 | var chalk = require('chalk')
9 | var webpack = require('webpack')
10 | var config = require('../config')
11 | var webpackConfig = require('./webpack.prod.conf')
12 |
13 | var spinner = ora('building for production...')
14 | spinner.start()
15 |
16 | rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
17 | if (err) throw err
18 | webpack(webpackConfig, function (err, stats) {
19 | spinner.stop()
20 | if (err) throw err
21 | process.stdout.write(stats.toString({
22 | colors: true,
23 | modules: false,
24 | children: false,
25 | chunks: false,
26 | chunkModules: false
27 | }) + '\n\n')
28 |
29 | console.log(chalk.cyan(' Build complete.\n'))
30 | console.log(chalk.yellow(
31 | ' Tip: built files are meant to be served over an HTTP server.\n' +
32 | ' Opening index.html over file:// won\'t work.\n'
33 | ))
34 | })
35 | })
36 |
--------------------------------------------------------------------------------
/build/check-versions.js:
--------------------------------------------------------------------------------
1 | var chalk = require('chalk')
2 | var semver = require('semver')
3 | var packageConfig = require('../package.json')
4 |
5 | function exec (cmd) {
6 | return require('child_process').execSync(cmd).toString().trim()
7 | }
8 |
9 | var versionRequirements = [
10 | {
11 | name: 'node',
12 | currentVersion: semver.clean(process.version),
13 | versionRequirement: packageConfig.engines.node
14 | },
15 | {
16 | name: 'npm',
17 | currentVersion: exec('npm --version'),
18 | versionRequirement: packageConfig.engines.npm
19 | }
20 | ]
21 |
22 | module.exports = function () {
23 | var warnings = []
24 | for (var i = 0; i < versionRequirements.length; i++) {
25 | var mod = versionRequirements[i]
26 | if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
27 | warnings.push(mod.name + ': ' +
28 | chalk.red(mod.currentVersion) + ' should be ' +
29 | chalk.green(mod.versionRequirement)
30 | )
31 | }
32 | }
33 |
34 | if (warnings.length) {
35 | console.log('')
36 | console.log(chalk.yellow('To use this template, you must update following to modules:'))
37 | console.log()
38 | for (var i = 0; i < warnings.length; i++) {
39 | var warning = warnings[i]
40 | console.log(' ' + warning)
41 | }
42 | console.log()
43 | process.exit(1)
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/build/dev-client.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable */
2 | require('eventsource-polyfill')
3 | var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true')
4 |
5 | hotClient.subscribe(function (event) {
6 | if (event.action === 'reload') {
7 | window.location.reload()
8 | }
9 | })
10 |
--------------------------------------------------------------------------------
/build/dev-server.js:
--------------------------------------------------------------------------------
1 | require('./check-versions')()
2 |
3 | var config = require('../config')
4 | if (!process.env.NODE_ENV) {
5 | process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
6 | }
7 |
8 | var opn = require('opn')
9 | var path = require('path')
10 | var express = require('express')
11 | var webpack = require('webpack')
12 | var proxyMiddleware = require('http-proxy-middleware')
13 | var webpackConfig = process.env.NODE_ENV === 'testing'
14 | ? require('./webpack.prod.conf')
15 | : require('./webpack.dev.conf')
16 |
17 | // default port where dev server listens for incoming traffic
18 | var port = process.env.PORT || config.dev.port
19 | // automatically open browser, if not set will be false
20 | var autoOpenBrowser = !!config.dev.autoOpenBrowser
21 | // Define HTTP proxies to your custom API backend
22 | // https://github.com/chimurai/http-proxy-middleware
23 | var proxyTable = config.dev.proxyTable
24 |
25 | var app = express()
26 | /* datura接口 20170302 */
27 | var appData = require('../goods.json')
28 | var goods = appData.goods
29 | var apiRoutes = express.Router()
30 | apiRoutes.get('/goods', function(req, res){
31 | res.json({
32 | data: goods
33 | })
34 | })
35 | app.use('/api', apiRoutes)
36 | /* datura接口 _end */
37 | var compiler = webpack(webpackConfig)
38 |
39 | var devMiddleware = require('webpack-dev-middleware')(compiler, {
40 | publicPath: webpackConfig.output.publicPath,
41 | quiet: true
42 | })
43 |
44 | var hotMiddleware = require('webpack-hot-middleware')(compiler, {
45 | log: () => {}
46 | })
47 | // force page reload when html-webpack-plugin template changes
48 | compiler.plugin('compilation', function (compilation) {
49 | compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
50 | hotMiddleware.publish({ action: 'reload' })
51 | cb()
52 | })
53 | })
54 |
55 | // proxy api requests
56 | Object.keys(proxyTable).forEach(function (context) {
57 | var options = proxyTable[context]
58 | if (typeof options === 'string') {
59 | options = { target: options }
60 | }
61 | app.use(proxyMiddleware(options.filter || context, options))
62 | })
63 |
64 | // handle fallback for HTML5 history API
65 | app.use(require('connect-history-api-fallback')())
66 |
67 | // serve webpack bundle output
68 | app.use(devMiddleware)
69 |
70 | // enable hot-reload and state-preserving
71 | // compilation error display
72 | app.use(hotMiddleware)
73 |
74 | // serve pure static assets
75 | var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
76 | app.use(staticPath, express.static('./static'))
77 |
78 | var uri = 'http://localhost:' + port
79 |
80 | devMiddleware.waitUntilValid(function () {
81 | console.log('> Listening at ' + uri + '\n')
82 | })
83 |
84 | module.exports = app.listen(port, function (err) {
85 | if (err) {
86 | console.log(err)
87 | return
88 | }
89 |
90 | // when env is testing, don't need open it
91 | if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
92 | opn(uri)
93 | }
94 | })
95 |
--------------------------------------------------------------------------------
/build/utils.js:
--------------------------------------------------------------------------------
1 | var path = require('path')
2 | var config = require('../config')
3 | var ExtractTextPlugin = require('extract-text-webpack-plugin')
4 |
5 | exports.assetsPath = function (_path) {
6 | var assetsSubDirectory = process.env.NODE_ENV === 'production'
7 | ? config.build.assetsSubDirectory
8 | : config.dev.assetsSubDirectory
9 | return path.posix.join(assetsSubDirectory, _path)
10 | }
11 |
12 | exports.cssLoaders = function (options) {
13 | options = options || {}
14 |
15 | var cssLoader = {
16 | loader: 'css-loader',
17 | options: {
18 | minimize: process.env.NODE_ENV === 'production',
19 | sourceMap: options.sourceMap
20 | }
21 | }
22 |
23 | // generate loader string to be used with extract text plugin
24 | function generateLoaders (loader, loaderOptions) {
25 | var loaders = [cssLoader]
26 | if (loader) {
27 | loaders.push({
28 | loader: loader + '-loader',
29 | options: Object.assign({}, loaderOptions, {
30 | sourceMap: options.sourceMap
31 | })
32 | })
33 | }
34 |
35 | // Extract CSS when that option is specified
36 | // (which is the case during production build)
37 | if (options.extract) {
38 | return ExtractTextPlugin.extract({
39 | use: loaders,
40 | fallback: 'vue-style-loader'
41 | })
42 | } else {
43 | return ['vue-style-loader'].concat(loaders)
44 | }
45 | }
46 |
47 | // http://vuejs.github.io/vue-loader/en/configurations/extract-css.html
48 | return {
49 | css: generateLoaders(),
50 | postcss: generateLoaders(),
51 | less: generateLoaders('less'),
52 | sass: generateLoaders('sass', { indentedSyntax: true }),
53 | scss: generateLoaders('sass'),
54 | stylus: generateLoaders('stylus'),
55 | styl: generateLoaders('stylus')
56 | }
57 | }
58 |
59 | // Generate loaders for standalone style files (outside of .vue)
60 | exports.styleLoaders = function (options) {
61 | var output = []
62 | var loaders = exports.cssLoaders(options)
63 | for (var extension in loaders) {
64 | var loader = loaders[extension]
65 | output.push({
66 | test: new RegExp('\\.' + extension + '$'),
67 | use: loader
68 | })
69 | }
70 | return output
71 | }
72 |
--------------------------------------------------------------------------------
/build/vue-loader.conf.js:
--------------------------------------------------------------------------------
1 | var utils = require('./utils')
2 | var config = require('../config')
3 | var isProduction = process.env.NODE_ENV === 'production'
4 |
5 | module.exports = {
6 | loaders: utils.cssLoaders({
7 | sourceMap: isProduction
8 | ? config.build.productionSourceMap
9 | : config.dev.cssSourceMap,
10 | extract: isProduction
11 | })
12 | }
13 |
--------------------------------------------------------------------------------
/build/webpack.base.conf.js:
--------------------------------------------------------------------------------
1 | var path = require('path')
2 | var utils = require('./utils')
3 | var config = require('../config')
4 | var vueLoaderConfig = require('./vue-loader.conf')
5 |
6 | function resolve (dir) {
7 | return path.join(__dirname, '..', dir)
8 | }
9 |
10 | module.exports = {
11 | entry: {
12 | app: './src/main.js'
13 | },
14 | output: {
15 | path: config.build.assetsRoot,
16 | filename: '[name].js',
17 | publicPath: process.env.NODE_ENV === 'production'
18 | ? config.build.assetsPublicPath
19 | : config.dev.assetsPublicPath
20 | },
21 | resolve: {
22 | extensions: ['.js', '.vue', '.json'],
23 | alias: {
24 | 'vue$': 'vue/dist/vue.esm.js',
25 | '@': resolve('src'),
26 | }
27 | },
28 | module: {
29 | rules: [
30 | {
31 | test: /\.vue$/,
32 | loader: 'vue-loader',
33 | options: vueLoaderConfig
34 | },
35 | {
36 | test: /\.js$/,
37 | loader: 'babel-loader',
38 | include: [resolve('src'), resolve('test')]
39 | },
40 | {
41 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
42 | loader: 'url-loader',
43 | query: {
44 | limit: 10000,
45 | name: utils.assetsPath('img/[name].[hash:7].[ext]')
46 | }
47 | },
48 | {
49 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
50 | loader: 'url-loader',
51 | query: {
52 | limit: 10000,
53 | name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
54 | }
55 | }
56 | ]
57 | }
58 | }
59 |
--------------------------------------------------------------------------------
/build/webpack.dev.conf.js:
--------------------------------------------------------------------------------
1 | var utils = require('./utils')
2 | var webpack = require('webpack')
3 | var config = require('../config')
4 | var merge = require('webpack-merge')
5 | var baseWebpackConfig = require('./webpack.base.conf')
6 | var HtmlWebpackPlugin = require('html-webpack-plugin')
7 | var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
8 |
9 | // add hot-reload related code to entry chunks
10 | Object.keys(baseWebpackConfig.entry).forEach(function (name) {
11 | baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
12 | })
13 |
14 | module.exports = merge(baseWebpackConfig, {
15 | module: {
16 | rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
17 | },
18 | // cheap-module-eval-source-map is faster for development
19 | devtool: '#cheap-module-eval-source-map',
20 | plugins: [
21 | new webpack.DefinePlugin({
22 | 'process.env': config.dev.env
23 | }),
24 | // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
25 | new webpack.HotModuleReplacementPlugin(),
26 | new webpack.NoEmitOnErrorsPlugin(),
27 | // https://github.com/ampedandwired/html-webpack-plugin
28 | new HtmlWebpackPlugin({
29 | filename: 'index.html',
30 | template: 'index.html',
31 | inject: true
32 | }),
33 | new FriendlyErrorsPlugin()
34 | ]
35 | })
36 |
--------------------------------------------------------------------------------
/build/webpack.prod.conf.js:
--------------------------------------------------------------------------------
1 | var path = require('path')
2 | var utils = require('./utils')
3 | var webpack = require('webpack')
4 | var config = require('../config')
5 | var merge = require('webpack-merge')
6 | var baseWebpackConfig = require('./webpack.base.conf')
7 | var CopyWebpackPlugin = require('copy-webpack-plugin')
8 | var HtmlWebpackPlugin = require('html-webpack-plugin')
9 | var ExtractTextPlugin = require('extract-text-webpack-plugin')
10 | var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
11 |
12 | var env = process.env.NODE_ENV === 'testing'
13 | ? require('../config/test.env')
14 | : config.build.env
15 |
16 | var webpackConfig = merge(baseWebpackConfig, {
17 | module: {
18 | rules: utils.styleLoaders({
19 | sourceMap: config.build.productionSourceMap,
20 | extract: true
21 | })
22 | },
23 | devtool: config.build.productionSourceMap ? '#source-map' : false,
24 | output: {
25 | path: config.build.assetsRoot,
26 | filename: utils.assetsPath('js/[name].[chunkhash].js'),
27 | chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
28 | },
29 | plugins: [
30 | // http://vuejs.github.io/vue-loader/en/workflow/production.html
31 | new webpack.DefinePlugin({
32 | 'process.env': env
33 | }),
34 | new webpack.optimize.UglifyJsPlugin({
35 | compress: {
36 | warnings: false
37 | },
38 | sourceMap: true
39 | }),
40 | // extract css into its own file
41 | new ExtractTextPlugin({
42 | filename: utils.assetsPath('css/[name].[contenthash].css')
43 | }),
44 | // Compress extracted CSS. We are using this plugin so that possible
45 | // duplicated CSS from different components can be deduped.
46 | new OptimizeCSSPlugin(),
47 | // generate dist index.html with correct asset hash for caching.
48 | // you can customize output by editing /index.html
49 | // see https://github.com/ampedandwired/html-webpack-plugin
50 | new HtmlWebpackPlugin({
51 | filename: process.env.NODE_ENV === 'testing'
52 | ? 'index.html'
53 | : config.build.index,
54 | template: 'index.html',
55 | inject: true,
56 | minify: {
57 | removeComments: true,
58 | collapseWhitespace: true,
59 | removeAttributeQuotes: true
60 | // more options:
61 | // https://github.com/kangax/html-minifier#options-quick-reference
62 | },
63 | // necessary to consistently work with multiple chunks via CommonsChunkPlugin
64 | chunksSortMode: 'dependency'
65 | }),
66 | // split vendor js into its own file
67 | new webpack.optimize.CommonsChunkPlugin({
68 | name: 'vendor',
69 | minChunks: function (module, count) {
70 | // any required modules inside node_modules are extracted to vendor
71 | return (
72 | module.resource &&
73 | /\.js$/.test(module.resource) &&
74 | module.resource.indexOf(
75 | path.join(__dirname, '../node_modules')
76 | ) === 0
77 | )
78 | }
79 | }),
80 | // extract webpack runtime and module manifest to its own file in order to
81 | // prevent vendor hash from being updated whenever app bundle is updated
82 | new webpack.optimize.CommonsChunkPlugin({
83 | name: 'manifest',
84 | chunks: ['vendor']
85 | }),
86 | // copy custom static assets
87 | new CopyWebpackPlugin([
88 | {
89 | from: path.resolve(__dirname, '../static'),
90 | to: config.build.assetsSubDirectory,
91 | ignore: ['.*']
92 | }
93 | ])
94 | ]
95 | })
96 |
97 | if (config.build.productionGzip) {
98 | var CompressionWebpackPlugin = require('compression-webpack-plugin')
99 |
100 | webpackConfig.plugins.push(
101 | new CompressionWebpackPlugin({
102 | asset: '[path].gz[query]',
103 | algorithm: 'gzip',
104 | test: new RegExp(
105 | '\\.(' +
106 | config.build.productionGzipExtensions.join('|') +
107 | ')$'
108 | ),
109 | threshold: 10240,
110 | minRatio: 0.8
111 | })
112 | )
113 | }
114 |
115 | if (config.build.bundleAnalyzerReport) {
116 | var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
117 | webpackConfig.plugins.push(new BundleAnalyzerPlugin())
118 | }
119 |
120 | module.exports = webpackConfig
121 |
--------------------------------------------------------------------------------
/build/webpack.test.conf.js:
--------------------------------------------------------------------------------
1 | // This is the webpack config used for unit tests.
2 |
3 | var utils = require('./utils')
4 | var webpack = require('webpack')
5 | var merge = require('webpack-merge')
6 | var baseConfig = require('./webpack.base.conf')
7 |
8 | var webpackConfig = merge(baseConfig, {
9 | // use inline sourcemap for karma-sourcemap-loader
10 | module: {
11 | rules: utils.styleLoaders()
12 | },
13 | devtool: '#inline-source-map',
14 | plugins: [
15 | new webpack.DefinePlugin({
16 | 'process.env': require('../config/test.env')
17 | })
18 | ]
19 | })
20 |
21 | // no need for app entry during tests
22 | delete webpackConfig.entry
23 |
24 | module.exports = webpackConfig
25 |
--------------------------------------------------------------------------------
/config/dev.env.js:
--------------------------------------------------------------------------------
1 | var merge = require('webpack-merge')
2 | var prodEnv = require('./prod.env')
3 |
4 | module.exports = merge(prodEnv, {
5 | NODE_ENV: '"development"'
6 | })
7 |
--------------------------------------------------------------------------------
/config/index.js:
--------------------------------------------------------------------------------
1 | // see http://vuejs-templates.github.io/webpack for documentation.
2 | var path = require('path')
3 |
4 | module.exports = {
5 | build: {
6 | env: require('./prod.env'),
7 | index: path.resolve(__dirname, '../dist/index.html'),
8 | assetsRoot: path.resolve(__dirname, '../dist'),
9 | assetsSubDirectory: 'static',
10 | assetsPublicPath: '/',
11 | productionSourceMap: true,
12 | // Gzip off by default as many popular static hosts such as
13 | // Surge or Netlify already gzip all static assets for you.
14 | // Before setting to `true`, make sure to:
15 | // npm install --save-dev compression-webpack-plugin
16 | productionGzip: false,
17 | productionGzipExtensions: ['js', 'css'],
18 | // Run the build command with an extra argument to
19 | // View the bundle analyzer report after build finishes:
20 | // `npm run build --report`
21 | // Set to `true` or `false` to always turn it on or off
22 | bundleAnalyzerReport: process.env.npm_config_report
23 | },
24 | dev: {
25 | env: require('./dev.env'),
26 | port: 8090,
27 | autoOpenBrowser: true,
28 | assetsSubDirectory: 'static',
29 | assetsPublicPath: '/',
30 | proxyTable: {},
31 | // CSS Sourcemaps off by default because relative paths are "buggy"
32 | // with this option, according to the CSS-Loader README
33 | // (https://github.com/webpack/css-loader#sourcemaps)
34 | // In our experience, they generally work as expected,
35 | // just be aware of this issue when enabling this option.
36 | cssSourceMap: false
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/config/prod.env.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | NODE_ENV: '"production"'
3 | }
4 |
--------------------------------------------------------------------------------
/config/test.env.js:
--------------------------------------------------------------------------------
1 | var merge = require('webpack-merge')
2 | var devEnv = require('./dev.env')
3 |
4 | module.exports = merge(devEnv, {
5 | NODE_ENV: '"testing"'
6 | })
7 |
--------------------------------------------------------------------------------
/data.json:
--------------------------------------------------------------------------------
1 | {
2 | "goods": [
3 | { "price": "69.9", "title": "德芙", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t3688/270/776223567/128582/fa074fb3/58170f6dN6b9a12bf.jpg!q50.jpg.webp" },
4 | { "price": "63", "title": "费列罗", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t613/100/1264998035/221234/1a29d51f/54c34525Nb4f6581c.jpg!q50.jpg.webp"},
5 | { "price": "29.9", "title": "大米", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t1258/40/17387560/108696/aced445f/54e011deN3ae867ae.jpg!q50.jpg.webp"},
6 | { "price": "54.9", "title": "安慕希", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2734/15/680373407/215934/3abaa748/572057daNc09b5da7.jpg!q50.jpg.webp"},
7 | { "price": "58", "title": "金典", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2482/145/1424008556/91991/d62f5454/569f47a2N3f763060.jpg!q50.jpg.webp"},
8 | { "price": "60", "title": "味可滋", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2368/3/874563950/70786/7b5e8edd/563074c8N4d535db4.jpg!q50.jpg.webp" },
9 | { "price": "248.00", "title": "泸州老窖", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t283/166/1424018055/189580/7c0792b7/543b4958N05fa2feb.jpg!q50.jpg.webp"},
10 | { "price": "328.8", "title": "剑南春", "img": "http://m.360buyimg.com/babel/s350x350_g15/M05/1A/0A/rBEhWlNeLAwIAAAAAAHyok3PZY0AAMl8gO8My0AAfK6307.jpg!q50.jpg.webp"},
11 | { "price": "49.00", "title": "蓝莓", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2332/148/2952098628/94387/e64654e2/56f8d76aNb088c2ab.jpg!q50.jpg.webp" },
12 | { "price": "68", "title": "芒果", "img": "http://m.360buyimg.com/n0/jfs/t3709/334/1378702984/206759/5c100ab5/58253588Naaa05c5c.jpg!q70.jpg"}
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/goods.json:
--------------------------------------------------------------------------------
1 | {
2 | "goods": [
3 | { "price": "69.9", "title": "德芙", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t3688/270/776223567/128582/fa074fb3/58170f6dN6b9a12bf.jpg!q50.jpg.webp" },
4 | { "price": "63", "title": "费列罗", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t613/100/1264998035/221234/1a29d51f/54c34525Nb4f6581c.jpg!q50.jpg.webp"},
5 | { "price": "29.9", "title": "大米", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t1258/40/17387560/108696/aced445f/54e011deN3ae867ae.jpg!q50.jpg.webp"},
6 | { "price": "54.9", "title": "安慕希", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2734/15/680373407/215934/3abaa748/572057daNc09b5da7.jpg!q50.jpg.webp"},
7 | { "price": "58", "title": "金典", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2482/145/1424008556/91991/d62f5454/569f47a2N3f763060.jpg!q50.jpg.webp"},
8 | { "price": "60", "title": "味可滋", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2368/3/874563950/70786/7b5e8edd/563074c8N4d535db4.jpg!q50.jpg.webp" },
9 | { "price": "248.00", "title": "泸州老窖", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t283/166/1424018055/189580/7c0792b7/543b4958N05fa2feb.jpg!q50.jpg.webp"},
10 | { "price": "328.8", "title": "剑南春", "img": "http://m.360buyimg.com/babel/s350x350_g15/M05/1A/0A/rBEhWlNeLAwIAAAAAAHyok3PZY0AAMl8gO8My0AAfK6307.jpg!q50.jpg.webp"},
11 | { "price": "49.00", "title": "蓝莓", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2332/148/2952098628/94387/e64654e2/56f8d76aNb088c2ab.jpg!q50.jpg.webp" },
12 | { "price": "68", "title": "芒果", "img": "http://m.360buyimg.com/n0/jfs/t3709/334/1378702984/206759/5c100ab5/58253588Naaa05c5c.jpg!q70.jpg"}
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | secondproject
6 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
28 |
29 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | ["env", {
4 | "modules": false
5 | }],
6 | "stage-2"
7 | ],
8 | "plugins": ["transform-runtime"],
9 | "env": {
10 | "test": {
11 | "presets": ["env", "stage-2"],
12 | "plugins": ["transform-es2015-modules-commonjs", "dynamic-import-node"]
13 | }
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/.editorconfig:
--------------------------------------------------------------------------------
1 | root = true
2 |
3 | [*]
4 | charset = utf-8
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules/
3 | /dist/
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | /test/unit/coverage/
8 | /test/e2e/reports/
9 | selenium-debug.log
10 |
11 | # Editor directories and files
12 | .idea
13 | .vscode
14 | *.suo
15 | *.ntvs*
16 | *.njsproj
17 | *.sln
18 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/.postcssrc.js:
--------------------------------------------------------------------------------
1 | // https://github.com/michael-ciniawsky/postcss-load-config
2 |
3 | module.exports = {
4 | "plugins": {
5 | // to edit target browsers: use "browserslist" field in package.json
6 | "postcss-import": {},
7 | "autoprefixer": {}
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/README.md:
--------------------------------------------------------------------------------
1 | # new_vue_cli
2 |
3 | > A Vue.js project
4 |
5 | ## Build Setup
6 |
7 | ``` bash
8 | # install dependencies
9 | npm install
10 |
11 | # serve with hot reload at localhost:8080
12 | npm run dev
13 |
14 | # build for production with minification
15 | npm run build
16 |
17 | # build for production and view the bundle analyzer report
18 | npm run build --report
19 |
20 | # run unit tests
21 | npm run unit
22 |
23 | # run e2e tests
24 | npm run e2e
25 |
26 | # run all tests
27 | npm test
28 | ```
29 |
30 | For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
31 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/build.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | require('./check-versions')()
3 |
4 | process.env.NODE_ENV = 'production'
5 |
6 | const ora = require('ora')
7 | const rm = require('rimraf')
8 | const path = require('path')
9 | const chalk = require('chalk')
10 | const webpack = require('webpack')
11 | const config = require('../config')
12 | const webpackConfig = require('./webpack.prod.conf')
13 |
14 | const spinner = ora('building for production...')
15 | spinner.start()
16 |
17 | rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
18 | if (err) throw err
19 | webpack(webpackConfig, function (err, stats) {
20 | spinner.stop()
21 | if (err) throw err
22 | process.stdout.write(stats.toString({
23 | colors: true,
24 | modules: false,
25 | children: false,
26 | chunks: false,
27 | chunkModules: false
28 | }) + '\n\n')
29 |
30 | if (stats.hasErrors()) {
31 | console.log(chalk.red(' Build failed with errors.\n'))
32 | process.exit(1)
33 | }
34 |
35 | console.log(chalk.cyan(' Build complete.\n'))
36 | console.log(chalk.yellow(
37 | ' Tip: built files are meant to be served over an HTTP server.\n' +
38 | ' Opening index.html over file:// won\'t work.\n'
39 | ))
40 | })
41 | })
42 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/check-versions.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const chalk = require('chalk')
3 | const semver = require('semver')
4 | const packageConfig = require('../package.json')
5 | const shell = require('shelljs')
6 | function exec (cmd) {
7 | return require('child_process').execSync(cmd).toString().trim()
8 | }
9 |
10 | const versionRequirements = [
11 | {
12 | name: 'node',
13 | currentVersion: semver.clean(process.version),
14 | versionRequirement: packageConfig.engines.node
15 | }
16 | ]
17 |
18 | if (shell.which('npm')) {
19 | versionRequirements.push({
20 | name: 'npm',
21 | currentVersion: exec('npm --version'),
22 | versionRequirement: packageConfig.engines.npm
23 | })
24 | }
25 |
26 | module.exports = function () {
27 | const warnings = []
28 | for (let i = 0; i < versionRequirements.length; i++) {
29 | const mod = versionRequirements[i]
30 | if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
31 | warnings.push(mod.name + ': ' +
32 | chalk.red(mod.currentVersion) + ' should be ' +
33 | chalk.green(mod.versionRequirement)
34 | )
35 | }
36 | }
37 |
38 | if (warnings.length) {
39 | console.log('')
40 | console.log(chalk.yellow('To use this template, you must update following to modules:'))
41 | console.log()
42 | for (let i = 0; i < warnings.length; i++) {
43 | const warning = warnings[i]
44 | console.log(' ' + warning)
45 | }
46 | console.log()
47 | process.exit(1)
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/new_vue_cli(解决dev-ser丢失)/build/logo.png
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/utils.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const path = require('path')
3 | const config = require('../config')
4 | const ExtractTextPlugin = require('extract-text-webpack-plugin')
5 | const pkg = require('../package.json')
6 |
7 | exports.assetsPath = function (_path) {
8 | const assetsSubDirectory = process.env.NODE_ENV === 'production'
9 | ? config.build.assetsSubDirectory
10 | : config.dev.assetsSubDirectory
11 | return path.posix.join(assetsSubDirectory, _path)
12 | }
13 |
14 | exports.cssLoaders = function (options) {
15 | options = options || {}
16 |
17 | const cssLoader = {
18 | loader: 'css-loader',
19 | options: {
20 | sourceMap: options.sourceMap
21 | }
22 | }
23 |
24 | var postcssLoader = {
25 | loader: 'postcss-loader',
26 | options: {
27 | sourceMap: options.sourceMap
28 | }
29 | }
30 |
31 | // generate loader string to be used with extract text plugin
32 | function generateLoaders (loader, loaderOptions) {
33 | const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
34 | if (loader) {
35 | loaders.push({
36 | loader: loader + '-loader',
37 | options: Object.assign({}, loaderOptions, {
38 | sourceMap: options.sourceMap
39 | })
40 | })
41 | }
42 |
43 | // Extract CSS when that option is specified
44 | // (which is the case during production build)
45 | if (options.extract) {
46 | return ExtractTextPlugin.extract({
47 | use: loaders,
48 | fallback: 'vue-style-loader'
49 | })
50 | } else {
51 | return ['vue-style-loader'].concat(loaders)
52 | }
53 | }
54 |
55 | // https://vue-loader.vuejs.org/en/configurations/extract-css.html
56 | return {
57 | css: generateLoaders(),
58 | postcss: generateLoaders(),
59 | less: generateLoaders('less'),
60 | sass: generateLoaders('sass', { indentedSyntax: true }),
61 | scss: generateLoaders('sass'),
62 | stylus: generateLoaders('stylus'),
63 | styl: generateLoaders('stylus')
64 | }
65 | }
66 |
67 | // Generate loaders for standalone style files (outside of .vue)
68 | exports.styleLoaders = function (options) {
69 | const output = []
70 | const loaders = exports.cssLoaders(options)
71 | for (const extension in loaders) {
72 | const loader = loaders[extension]
73 | output.push({
74 | test: new RegExp('\\.' + extension + '$'),
75 | use: loader
76 | })
77 | }
78 | return output
79 | }
80 |
81 | exports.createNotifierCallback = function () {
82 | const notifier = require('node-notifier')
83 |
84 | return (severity, errors) => {
85 | if (severity !== 'error') {
86 | return
87 | }
88 | const error = errors[0]
89 |
90 | const filename = error.file && error.file.split('!').pop()
91 | notifier.notify({
92 | title: pkg.name,
93 | message: severity + ': ' + error.name,
94 | subtitle: filename || '',
95 | icon: path.join(__dirname, 'logo.png')
96 | })
97 | }
98 | }
99 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/vue-loader.conf.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const utils = require('./utils')
3 | const config = require('../config')
4 | const isProduction = process.env.NODE_ENV === 'production'
5 | const sourceMapEnabled = isProduction
6 | ? config.build.productionSourceMap
7 | : config.dev.cssSourceMap
8 |
9 |
10 | module.exports = {
11 | loaders: utils.cssLoaders({
12 | sourceMap: sourceMapEnabled,
13 | extract: isProduction
14 | }),
15 | cssSourceMap: sourceMapEnabled,
16 | cacheBusting: config.dev.cacheBusting,
17 | transformToRequire: {
18 | video: 'src',
19 | source: 'src',
20 | img: 'src',
21 | image: 'xlink:href'
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/webpack.base.conf.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const path = require('path')
3 | const utils = require('./utils')
4 | const config = require('../config')
5 | const vueLoaderConfig = require('./vue-loader.conf')
6 |
7 | function resolve (dir) {
8 | return path.join(__dirname, '..', dir)
9 | }
10 |
11 | module.exports = {
12 | context: path.resolve(__dirname, '../'),
13 | entry: {
14 | app: './src/main.js'
15 | },
16 | output: {
17 | path: config.build.assetsRoot,
18 | filename: '[name].js',
19 | publicPath: process.env.NODE_ENV === 'production'
20 | ? config.build.assetsPublicPath
21 | : config.dev.assetsPublicPath
22 | },
23 | resolve: {
24 | extensions: ['.js', '.vue', '.json'],
25 | alias: {
26 | 'vue$': 'vue/dist/vue.esm.js',
27 | '@': resolve('src'),
28 | }
29 | },
30 | module: {
31 | rules: [
32 | {
33 | test: /\.vue$/,
34 | loader: 'vue-loader',
35 | options: vueLoaderConfig
36 | },
37 | {
38 | test: /\.js$/,
39 | loader: 'babel-loader',
40 | include: [resolve('src'), resolve('test')]
41 | },
42 | {
43 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
44 | loader: 'url-loader',
45 | options: {
46 | limit: 10000,
47 | name: utils.assetsPath('img/[name].[hash:7].[ext]')
48 | }
49 | },
50 | {
51 | test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
52 | loader: 'url-loader',
53 | options: {
54 | limit: 10000,
55 | name: utils.assetsPath('media/[name].[hash:7].[ext]')
56 | }
57 | },
58 | {
59 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
60 | loader: 'url-loader',
61 | options: {
62 | limit: 10000,
63 | name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
64 | }
65 | }
66 | ]
67 | }
68 | }
69 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/webpack.dev.conf.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const utils = require('./utils')
3 | const webpack = require('webpack')
4 | const config = require('../config')
5 | const merge = require('webpack-merge')
6 | const baseWebpackConfig = require('./webpack.base.conf')
7 | const HtmlWebpackPlugin = require('html-webpack-plugin')
8 | const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
9 | const portfinder = require('portfinder')
10 | /* datura_lj 增加express 20171126 */
11 | const express = require('express')
12 | const app = express()
13 | var appData = require('../goods.json')//加载本地数据文件
14 | var goods = appData.goods
15 | var apiRoutes = express.Router()
16 | app.use('/api', apiRoutes)
17 | /* 增加express end */
18 | const devWebpackConfig = merge(baseWebpackConfig, {
19 | module: {
20 | rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
21 | },
22 | // cheap-module-eval-source-map is faster for development
23 | devtool: config.dev.devtool,
24 |
25 | // these devServer options should be customized in /config/index.js
26 | devServer: {
27 | clientLogLevel: 'warning',
28 | historyApiFallback: true,
29 | hot: true,
30 | compress: true,
31 | host: process.env.HOST || config.dev.host,
32 | port: process.env.PORT || config.dev.port,
33 | open: config.dev.autoOpenBrowser,
34 | overlay: config.dev.errorOverlay ? {
35 | warnings: false,
36 | errors: true,
37 | } : false,
38 | publicPath: config.dev.assetsPublicPath,
39 | proxy: config.dev.proxyTable,
40 | quiet: true, // necessary for FriendlyErrorsPlugin
41 | watchOptions: {
42 | poll: config.dev.poll,
43 | },
44 | /* datura_lj 增加express 20171126 */
45 | before(app) {
46 | app.get('/api/goods', (req, res) => {
47 | res.json({
48 | code: 0,
49 | data: goods
50 | })
51 | })
52 | }
53 | /* datura_lj 增加路由规则 end */
54 | },
55 | plugins: [
56 | new webpack.DefinePlugin({
57 | 'process.env': require('../config/dev.env')
58 | }),
59 | new webpack.HotModuleReplacementPlugin(),
60 | new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
61 | new webpack.NoEmitOnErrorsPlugin(),
62 | // https://github.com/ampedandwired/html-webpack-plugin
63 | new HtmlWebpackPlugin({
64 | filename: 'index.html',
65 | template: 'index.html',
66 | inject: true
67 | }),
68 | ]
69 | })
70 |
71 | module.exports = new Promise((resolve, reject) => {
72 | portfinder.basePort = process.env.PORT || config.dev.port
73 | portfinder.getPort((err, port) => {
74 | if (err) {
75 | reject(err)
76 | } else {
77 | // publish the new Port, necessary for e2e tests
78 | process.env.PORT = port
79 | // add port to devServer config
80 | devWebpackConfig.devServer.port = port
81 |
82 | // Add FriendlyErrorsPlugin
83 | devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
84 | compilationSuccessInfo: {
85 | messages: [`Your application is running here: http://${config.dev.host}:${port}`],
86 | },
87 | onErrors: config.dev.notifyOnErrors
88 | ? utils.createNotifierCallback()
89 | : undefined
90 | }))
91 |
92 | resolve(devWebpackConfig)
93 | }
94 | })
95 | })
96 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/webpack.prod.conf.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const path = require('path')
3 | const utils = require('./utils')
4 | const webpack = require('webpack')
5 | const config = require('../config')
6 | const merge = require('webpack-merge')
7 | const baseWebpackConfig = require('./webpack.base.conf')
8 | const CopyWebpackPlugin = require('copy-webpack-plugin')
9 | const HtmlWebpackPlugin = require('html-webpack-plugin')
10 | const ExtractTextPlugin = require('extract-text-webpack-plugin')
11 | const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
12 |
13 | const env = process.env.NODE_ENV === 'testing'
14 | ? require('../config/test.env')
15 | : require('../config/prod.env')
16 |
17 | const webpackConfig = merge(baseWebpackConfig, {
18 | module: {
19 | rules: utils.styleLoaders({
20 | sourceMap: config.build.productionSourceMap,
21 | extract: true,
22 | usePostCSS: true
23 | })
24 | },
25 | devtool: config.build.productionSourceMap ? config.build.devtool : false,
26 | output: {
27 | path: config.build.assetsRoot,
28 | filename: utils.assetsPath('js/[name].[chunkhash].js'),
29 | chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
30 | },
31 | plugins: [
32 | // http://vuejs.github.io/vue-loader/en/workflow/production.html
33 | new webpack.DefinePlugin({
34 | 'process.env': env
35 | }),
36 | // UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify
37 | new webpack.optimize.UglifyJsPlugin({
38 | compress: {
39 | warnings: false
40 | },
41 | sourceMap: config.build.productionSourceMap,
42 | parallel: true
43 | }),
44 | // extract css into its own file
45 | new ExtractTextPlugin({
46 | filename: utils.assetsPath('css/[name].[contenthash].css'),
47 | // set the following option to `true` if you want to extract CSS from
48 | // codesplit chunks into this main css file as well.
49 | // This will result in *all* of your app's CSS being loaded upfront.
50 | allChunks: false,
51 | }),
52 | // Compress extracted CSS. We are using this plugin so that possible
53 | // duplicated CSS from different components can be deduped.
54 | new OptimizeCSSPlugin({
55 | cssProcessorOptions: config.build.productionSourceMap
56 | ? { safe: true, map: { inline: false } }
57 | : { safe: true }
58 | }),
59 | // generate dist index.html with correct asset hash for caching.
60 | // you can customize output by editing /index.html
61 | // see https://github.com/ampedandwired/html-webpack-plugin
62 | new HtmlWebpackPlugin({
63 | filename: process.env.NODE_ENV === 'testing'
64 | ? 'index.html'
65 | : config.build.index,
66 | template: 'index.html',
67 | inject: true,
68 | minify: {
69 | removeComments: true,
70 | collapseWhitespace: true,
71 | removeAttributeQuotes: true
72 | // more options:
73 | // https://github.com/kangax/html-minifier#options-quick-reference
74 | },
75 | // necessary to consistently work with multiple chunks via CommonsChunkPlugin
76 | chunksSortMode: 'dependency'
77 | }),
78 | // keep module.id stable when vender modules does not change
79 | new webpack.HashedModuleIdsPlugin(),
80 | // enable scope hoisting
81 | new webpack.optimize.ModuleConcatenationPlugin(),
82 | // split vendor js into its own file
83 | new webpack.optimize.CommonsChunkPlugin({
84 | name: 'vendor',
85 | minChunks: function (module) {
86 | // any required modules inside node_modules are extracted to vendor
87 | return (
88 | module.resource &&
89 | /\.js$/.test(module.resource) &&
90 | module.resource.indexOf(
91 | path.join(__dirname, '../node_modules')
92 | ) === 0
93 | )
94 | }
95 | }),
96 | // extract webpack runtime and module manifest to its own file in order to
97 | // prevent vendor hash from being updated whenever app bundle is updated
98 | new webpack.optimize.CommonsChunkPlugin({
99 | name: 'manifest',
100 | minChunks: Infinity
101 | }),
102 | // This instance extracts shared chunks from code splitted chunks and bundles them
103 | // in a separate chunk, similar to the vendor chunk
104 | // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
105 | new webpack.optimize.CommonsChunkPlugin({
106 | name: 'app',
107 | async: 'vendor-async',
108 | children: true,
109 | minChunks: 3
110 | }),
111 |
112 | // copy custom static assets
113 | new CopyWebpackPlugin([
114 | {
115 | from: path.resolve(__dirname, '../static'),
116 | to: config.build.assetsSubDirectory,
117 | ignore: ['.*']
118 | }
119 | ])
120 | ]
121 | })
122 |
123 | if (config.build.productionGzip) {
124 | const CompressionWebpackPlugin = require('compression-webpack-plugin')
125 |
126 | webpackConfig.plugins.push(
127 | new CompressionWebpackPlugin({
128 | asset: '[path].gz[query]',
129 | algorithm: 'gzip',
130 | test: new RegExp(
131 | '\\.(' +
132 | config.build.productionGzipExtensions.join('|') +
133 | ')$'
134 | ),
135 | threshold: 10240,
136 | minRatio: 0.8
137 | })
138 | )
139 | }
140 |
141 | if (config.build.bundleAnalyzerReport) {
142 | const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
143 | webpackConfig.plugins.push(new BundleAnalyzerPlugin())
144 | }
145 |
146 | module.exports = webpackConfig
147 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/build/webpack.test.conf.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | // This is the webpack config used for unit tests.
3 |
4 | const utils = require('./utils')
5 | const webpack = require('webpack')
6 | const merge = require('webpack-merge')
7 | const baseWebpackConfig = require('./webpack.base.conf')
8 |
9 | const webpackConfig = merge(baseWebpackConfig, {
10 | // use inline sourcemap for karma-sourcemap-loader
11 | module: {
12 | rules: utils.styleLoaders()
13 | },
14 | devtool: '#inline-source-map',
15 | resolveLoader: {
16 | alias: {
17 | // necessary to to make lang="scss" work in test when using vue-loader's ?inject option
18 | // see discussion at https://github.com/vuejs/vue-loader/issues/724
19 | 'scss-loader': 'sass-loader'
20 | }
21 | },
22 | plugins: [
23 | new webpack.DefinePlugin({
24 | 'process.env': require('../config/test.env')
25 | })
26 | ]
27 | })
28 |
29 | // no need for app entry during tests
30 | delete webpackConfig.entry
31 |
32 | module.exports = webpackConfig
33 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/config/dev.env.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const merge = require('webpack-merge')
3 | const prodEnv = require('./prod.env')
4 |
5 | module.exports = merge(prodEnv, {
6 | NODE_ENV: '"development"'
7 | })
8 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/config/index.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | // Template version: 1.2.4
3 | // see http://vuejs-templates.github.io/webpack for documentation.
4 |
5 | const path = require('path')
6 |
7 | module.exports = {
8 | dev: {
9 |
10 | // Paths
11 | assetsSubDirectory: 'static',
12 | assetsPublicPath: '/',
13 | proxyTable: {},
14 |
15 | // Various Dev Server settings
16 | host: 'localhost', // can be overwritten by process.env.HOST
17 | port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
18 | autoOpenBrowser: false,
19 | errorOverlay: true,
20 | notifyOnErrors: true,
21 | poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
22 |
23 | // Use Eslint Loader?
24 | // If true, your code will be linted during bundling and
25 | // linting errors and warnings will be shown in the console.
26 | useEslint: true,
27 | // If true, eslint errors and warnings will also be shown in the error overlay
28 | // in the browser.
29 | showEslintErrorsInOverlay: false,
30 |
31 | /**
32 | * Source Maps
33 | */
34 |
35 | // https://webpack.js.org/configuration/devtool/#development
36 | devtool: 'eval-source-map',
37 |
38 | // If you have problems debugging vue-files in devtools,
39 | // set this to false - it *may* help
40 | // https://vue-loader.vuejs.org/en/options.html#cachebusting
41 | cacheBusting: true,
42 |
43 | // CSS Sourcemaps off by default because relative paths are "buggy"
44 | // with this option, according to the CSS-Loader README
45 | // (https://github.com/webpack/css-loader#sourcemaps)
46 | // In our experience, they generally work as expected,
47 | // just be aware of this issue when enabling this option.
48 | cssSourceMap: false,
49 | },
50 |
51 | build: {
52 | // Template for index.html
53 | index: path.resolve(__dirname, '../dist/index.html'),
54 |
55 | // Paths
56 | assetsRoot: path.resolve(__dirname, '../dist'),
57 | assetsSubDirectory: 'static',
58 | assetsPublicPath: '/',
59 |
60 | /**
61 | * Source Maps
62 | */
63 |
64 | productionSourceMap: true,
65 | // https://webpack.js.org/configuration/devtool/#production
66 | devtool: '#source-map',
67 |
68 | // Gzip off by default as many popular static hosts such as
69 | // Surge or Netlify already gzip all static assets for you.
70 | // Before setting to `true`, make sure to:
71 | // npm install --save-dev compression-webpack-plugin
72 | productionGzip: false,
73 | productionGzipExtensions: ['js', 'css'],
74 |
75 | // Run the build command with an extra argument to
76 | // View the bundle analyzer report after build finishes:
77 | // `npm run build --report`
78 | // Set to `true` or `false` to always turn it on or off
79 | bundleAnalyzerReport: process.env.npm_config_report
80 | }
81 | }
82 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/config/prod.env.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | module.exports = {
3 | NODE_ENV: '"production"'
4 | }
5 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/config/test.env.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 | const merge = require('webpack-merge')
3 | const devEnv = require('./dev.env')
4 |
5 | module.exports = merge(devEnv, {
6 | NODE_ENV: '"testing"'
7 | })
8 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/goods.json:
--------------------------------------------------------------------------------
1 | {
2 | "goods": [
3 | { "price": "69.9", "title": "德芙", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t3688/270/776223567/128582/fa074fb3/58170f6dN6b9a12bf.jpg!q50.jpg.webp" },
4 | { "price": "63", "title": "费列罗", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t613/100/1264998035/221234/1a29d51f/54c34525Nb4f6581c.jpg!q50.jpg.webp"},
5 | { "price": "29.9", "title": "大米", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t1258/40/17387560/108696/aced445f/54e011deN3ae867ae.jpg!q50.jpg.webp"},
6 | { "price": "54.9", "title": "安慕希", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2734/15/680373407/215934/3abaa748/572057daNc09b5da7.jpg!q50.jpg.webp"},
7 | { "price": "58", "title": "金典", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2482/145/1424008556/91991/d62f5454/569f47a2N3f763060.jpg!q50.jpg.webp"},
8 | { "price": "60", "title": "味可滋", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2368/3/874563950/70786/7b5e8edd/563074c8N4d535db4.jpg!q50.jpg.webp" },
9 | { "price": "248.00", "title": "泸州老窖", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t283/166/1424018055/189580/7c0792b7/543b4958N05fa2feb.jpg!q50.jpg.webp"},
10 | { "price": "328.8", "title": "剑南春", "img": "http://m.360buyimg.com/babel/s350x350_g15/M05/1A/0A/rBEhWlNeLAwIAAAAAAHyok3PZY0AAMl8gO8My0AAfK6307.jpg!q50.jpg.webp"},
11 | { "price": "49.00", "title": "蓝莓", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2332/148/2952098628/94387/e64654e2/56f8d76aNb088c2ab.jpg!q50.jpg.webp" },
12 | { "price": "68", "title": "芒果", "img": "http://m.360buyimg.com/n0/jfs/t3709/334/1378702984/206759/5c100ab5/58253588Naaa05c5c.jpg!q70.jpg"}
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | new_vue_cli
7 |
8 |
9 |
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "new_vue_cli",
3 | "version": "1.0.0",
4 | "description": "A Vue.js project",
5 | "author": "",
6 | "private": true,
7 | "scripts": {
8 | "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
9 | "start": "npm run dev",
10 | "unit": "jest --config test/unit/jest.conf.js --coverage",
11 | "e2e": "node test/e2e/runner.js",
12 | "test": "npm run unit && npm run e2e",
13 | "build": "node build/build.js"
14 | },
15 | "dependencies": {
16 | "vue": "^2.5.2",
17 | "vue-resource": "^1.3.4",
18 | "vue-router": "^3.0.1"
19 | },
20 | "devDependencies": {
21 | "autoprefixer": "^7.1.2",
22 | "babel-core": "^6.22.1",
23 | "babel-jest": "^21.0.2",
24 | "babel-loader": "^7.1.1",
25 | "babel-plugin-dynamic-import-node": "^1.2.0",
26 | "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
27 | "babel-plugin-transform-runtime": "^6.22.0",
28 | "babel-preset-env": "^1.3.2",
29 | "babel-preset-stage-2": "^6.22.0",
30 | "babel-register": "^6.22.0",
31 | "chalk": "^2.0.1",
32 | "chromedriver": "^2.27.2",
33 | "copy-webpack-plugin": "^4.0.1",
34 | "cross-spawn": "^5.0.1",
35 | "css-loader": "^0.28.0",
36 | "eventsource-polyfill": "^0.9.6",
37 | "express": "^4.16.2",
38 | "extract-text-webpack-plugin": "^3.0.0",
39 | "file-loader": "^1.1.4",
40 | "friendly-errors-webpack-plugin": "^1.6.1",
41 | "html-webpack-plugin": "^2.30.1",
42 | "jest": "^21.2.0",
43 | "jest-serializer-vue": "^0.3.0",
44 | "nightwatch": "^0.9.12",
45 | "node-notifier": "^5.1.2",
46 | "optimize-css-assets-webpack-plugin": "^3.2.0",
47 | "ora": "^1.2.0",
48 | "portfinder": "^1.0.13",
49 | "postcss-import": "^11.0.0",
50 | "postcss-loader": "^2.0.8",
51 | "rimraf": "^2.6.0",
52 | "selenium-server": "^3.0.1",
53 | "semver": "^5.3.0",
54 | "shelljs": "^0.7.6",
55 | "url-loader": "^0.5.8",
56 | "vue-jest": "^1.0.2",
57 | "vue-loader": "^13.3.0",
58 | "vue-style-loader": "^3.0.1",
59 | "vue-template-compiler": "^2.5.2",
60 | "webpack": "^3.6.0",
61 | "webpack-bundle-analyzer": "^2.9.0",
62 | "webpack-dev-server": "^2.9.1",
63 | "webpack-merge": "^4.1.0"
64 | },
65 | "engines": {
66 | "node": ">= 4.0.0",
67 | "npm": ">= 3.0.0"
68 | },
69 | "browserslist": [
70 | "> 1%",
71 | "last 2 versions",
72 | "not ie <= 8"
73 | ]
74 | }
75 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/server/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "json-server-demo",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "server": "cd static && nodemon server.js"
8 | },
9 | "author": "",
10 | "license": "ISC",
11 | "devDependencies": {
12 | "json-server": "^0.9.6",
13 | "nodemon": "^1.11.0"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/server/static/config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | SERVER:"127.0.0.1",
3 | PORT: 9527,
4 | DB_FILE:"db.json"
5 | };
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/server/static/db.json:
--------------------------------------------------------------------------------
1 | {
2 | "goods": [
3 | { "price": "69.9", "title": "德芙", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t3688/270/776223567/128582/fa074fb3/58170f6dN6b9a12bf.jpg!q50.jpg.webp" },
4 | { "price": "63", "title": "费列罗", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t613/100/1264998035/221234/1a29d51f/54c34525Nb4f6581c.jpg!q50.jpg.webp"},
5 | { "price": "29.9", "title": "大米", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t1258/40/17387560/108696/aced445f/54e011deN3ae867ae.jpg!q50.jpg.webp"},
6 | { "price": "54.9", "title": "安慕希", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2734/15/680373407/215934/3abaa748/572057daNc09b5da7.jpg!q50.jpg.webp"},
7 | { "price": "58", "title": "金典", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2482/145/1424008556/91991/d62f5454/569f47a2N3f763060.jpg!q50.jpg.webp"},
8 | { "price": "60", "title": "味可滋", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2368/3/874563950/70786/7b5e8edd/563074c8N4d535db4.jpg!q50.jpg.webp" },
9 | { "price": "248.00", "title": "泸州老窖", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t283/166/1424018055/189580/7c0792b7/543b4958N05fa2feb.jpg!q50.jpg.webp"},
10 | { "price": "328.8", "title": "剑南春", "img": "http://m.360buyimg.com/babel/s350x350_g15/M05/1A/0A/rBEhWlNeLAwIAAAAAAHyok3PZY0AAMl8gO8My0AAfK6307.jpg!q50.jpg.webp"},
11 | { "price": "49.00", "title": "蓝莓", "img": "http://m.360buyimg.com/babel/s211x211_jfs/t2332/148/2952098628/94387/e64654e2/56f8d76aNb088c2ab.jpg!q50.jpg.webp" },
12 | { "price": "68", "title": "芒果", "img": "http://m.360buyimg.com/n0/jfs/t3709/334/1378702984/206759/5c100ab5/58253588Naaa05c5c.jpg!q70.jpg"}
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/server/static/server.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const config = require('./config');
3 | const jsonServer = require('json-server');
4 |
5 | const ip = config.SERVER;
6 | const port = config.PORT;
7 | const db_file = config.DB_FILE;
8 |
9 | const server = jsonServer.create();
10 | const router = jsonServer.router(path.join(__dirname, config.DB_FILE));
11 | const middlewares = jsonServer.defaults();
12 |
13 | server.use(jsonServer.bodyParser);
14 | server.use(middlewares);
15 |
16 | server.use((req, res, next) => {
17 | res.header('X-Hello', 'datura_lj');
18 | next();
19 | })
20 | router.render = (req, res) => {
21 | res.jsonp({
22 | code: 0,
23 | body: res.locals.data
24 | })
25 | }
26 | server.use("/api", router);
27 |
28 | server.use(router);
29 | server.listen({
30 | host: ip,
31 | port: port
32 | }, function () {
33 | console.log(JSON.stringify(jsonServer));
34 | console.log(`JSON Server is running in http://${ip}:${port}`);
35 | });
36 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/src/App.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
12 |
13 |
16 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/src/assets/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/new_vue_cli(解决dev-ser丢失)/src/assets/logo.png
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/src/components/HelloWorld.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | -
5 |
{{ item.title }}
6 |
7 |
8 |
9 |
10 |
11 |
12 |
45 |
46 |
47 |
68 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/src/main.js:
--------------------------------------------------------------------------------
1 | // The Vue build version to load with the `import` command
2 | // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
3 | import Vue from 'vue'
4 | import App from './App'
5 | import router from './router'
6 | import VueResource from 'vue-resource'
7 | Vue.use(VueResource)
8 |
9 | Vue.config.productionTip = false
10 |
11 | /* eslint-disable no-new */
12 | new Vue({
13 | el: '#app',
14 | router,
15 | template: '',
16 | components: { App }
17 | })
18 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/src/router/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import Router from 'vue-router'
3 | import HelloWorld from '@/components/HelloWorld'
4 |
5 | Vue.use(Router)
6 |
7 | export default new Router({
8 | routes: [
9 | {
10 | path: '/',
11 | name: 'HelloWorld',
12 | component: HelloWorld
13 | }
14 | ]
15 | })
16 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/static/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/new_vue_cli(解决dev-ser丢失)/static/.gitkeep
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/e2e/custom-assertions/elementCount.js:
--------------------------------------------------------------------------------
1 | // A custom Nightwatch assertion.
2 | // The assertion name is the filename.
3 | // Example usage:
4 | //
5 | // browser.assert.elementCount(selector, count)
6 | //
7 | // For more information on custom assertions see:
8 | // http://nightwatchjs.org/guide#writing-custom-assertions
9 |
10 | exports.assertion = function (selector, count) {
11 | this.message = 'Testing if element <' + selector + '> has count: ' + count
12 | this.expected = count
13 | this.pass = function (val) {
14 | return val === this.expected
15 | }
16 | this.value = function (res) {
17 | return res.value
18 | }
19 | this.command = function (cb) {
20 | var self = this
21 | return this.api.execute(function (selectorToCount) {
22 | return document.querySelectorAll(selectorToCount).length
23 | }, [selector], function (res) {
24 | cb.call(self, res)
25 | })
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/e2e/nightwatch.conf.js:
--------------------------------------------------------------------------------
1 | require('babel-register')
2 | var config = require('../../config')
3 |
4 | // http://nightwatchjs.org/gettingstarted#settings-file
5 | module.exports = {
6 | src_folders: ['test/e2e/specs'],
7 | output_folder: 'test/e2e/reports',
8 | custom_assertions_path: ['test/e2e/custom-assertions'],
9 |
10 | selenium: {
11 | start_process: true,
12 | server_path: require('selenium-server').path,
13 | host: '127.0.0.1',
14 | port: 4444,
15 | cli_args: {
16 | 'webdriver.chrome.driver': require('chromedriver').path
17 | }
18 | },
19 |
20 | test_settings: {
21 | default: {
22 | selenium_port: 4444,
23 | selenium_host: 'localhost',
24 | silent: true,
25 | globals: {
26 | devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
27 | }
28 | },
29 |
30 | chrome: {
31 | desiredCapabilities: {
32 | browserName: 'chrome',
33 | javascriptEnabled: true,
34 | acceptSslCerts: true
35 | }
36 | },
37 |
38 | firefox: {
39 | desiredCapabilities: {
40 | browserName: 'firefox',
41 | javascriptEnabled: true,
42 | acceptSslCerts: true
43 | }
44 | }
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/e2e/runner.js:
--------------------------------------------------------------------------------
1 | // 1. start the dev server using production config
2 | process.env.NODE_ENV = 'testing'
3 |
4 | const webpack = require('webpack')
5 | const DevServer = require('webpack-dev-server')
6 |
7 | const webpackConfig = require('../../build/webpack.prod.conf')
8 | const devConfigPromise = require('../../build/webpack.dev.conf')
9 |
10 | let server
11 |
12 | devConfigPromise.then(devConfig => {
13 | const devServerOptions = devConfig.devServer
14 | const compiler = webpack(webpackConfig)
15 | server = new DevServer(compiler, devServerOptions)
16 | const port = devServerOptions.port
17 | const host = devServerOptions.host
18 | return server.listen(port, host)
19 | })
20 | .then(() => {
21 | // 2. run the nightwatch test suite against it
22 | // to run in additional browsers:
23 | // 1. add an entry in test/e2e/nightwatch.conf.json under "test_settings"
24 | // 2. add it to the --env flag below
25 | // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
26 | // For more information on Nightwatch's config file, see
27 | // http://nightwatchjs.org/guide#settings-file
28 | let opts = process.argv.slice(2)
29 | if (opts.indexOf('--config') === -1) {
30 | opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
31 | }
32 | if (opts.indexOf('--env') === -1) {
33 | opts = opts.concat(['--env', 'chrome'])
34 | }
35 |
36 | const spawn = require('cross-spawn')
37 | const runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' })
38 |
39 | runner.on('exit', function (code) {
40 | server.close()
41 | process.exit(code)
42 | })
43 |
44 | runner.on('error', function (err) {
45 | server.close()
46 | throw err
47 | })
48 | })
49 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/e2e/specs/test.js:
--------------------------------------------------------------------------------
1 | // For authoring Nightwatch tests, see
2 | // http://nightwatchjs.org/guide#usage
3 |
4 | module.exports = {
5 | 'default e2e tests': function (browser) {
6 | // automatically uses dev Server port from /config.index.js
7 | // default: http://localhost:8080
8 | // see nightwatch.conf.js
9 | const devServer = browser.globals.devServerURL
10 |
11 | browser
12 | .url(devServer)
13 | .waitForElementVisible('#app', 5000)
14 | .assert.elementPresent('.hello')
15 | .assert.containsText('h1', 'Welcome to Your Vue.js App')
16 | .assert.elementCount('img', 1)
17 | .end()
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/unit/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "jest": true
4 | },
5 | "globals": {
6 | }
7 | }
8 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/unit/jest.conf.js:
--------------------------------------------------------------------------------
1 | const path = require('path')
2 |
3 | module.exports = {
4 | rootDir: path.resolve(__dirname, '../../'),
5 | moduleFileExtensions: [
6 | 'js',
7 | 'json',
8 | 'vue'
9 | ],
10 | moduleNameMapper: {
11 | '^@/(.*)$': '/src/$1'
12 | },
13 | transform: {
14 | '^.+\\.js$': '/node_modules/babel-jest',
15 | '.*\\.(vue)$': '/node_modules/vue-jest'
16 | },
17 | testPathIgnorePatterns: [
18 | '/test/e2e'
19 | ],
20 | snapshotSerializers: ['/node_modules/jest-serializer-vue'],
21 | setupFiles: ['/test/unit/setup'],
22 | mapCoverage: true,
23 | coverageDirectory: '/test/unit/coverage',
24 | collectCoverageFrom: [
25 | 'src/**/*.{js,vue}',
26 | '!src/main.js',
27 | '!src/router/index.js',
28 | '!**/node_modules/**'
29 | ]
30 | }
31 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/unit/setup.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 |
3 | Vue.config.productionTip = false
4 |
--------------------------------------------------------------------------------
/new_vue_cli(解决dev-ser丢失)/test/unit/specs/HelloWorld.spec.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import HelloWorld from '@/components/HelloWorld'
3 |
4 | describe('HelloWorld.vue', () => {
5 | it('should render correct contents', () => {
6 | const Constructor = Vue.extend(HelloWorld)
7 | const vm = new Constructor().$mount()
8 | expect(vm.$el.querySelector('.hello h1').textContent)
9 | .toEqual('Welcome to Your Vue.js App')
10 | })
11 | })
12 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "secondproject",
3 | "version": "1.0.0",
4 | "description": "A Vue.js project",
5 | "author": "datura",
6 | "private": true,
7 | "scripts": {
8 | "dev": "node build/dev-server.js",
9 | "build": "node build/build.js",
10 | "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
11 | "e2e": "node test/e2e/runner.js",
12 | "test": "npm run unit && npm run e2e"
13 | },
14 | "dependencies": {
15 | "router": "^1.3.0",
16 | "vue": "^2.2.1",
17 | "vue-resource": "^1.2.1",
18 | "vue-router": "^2.3.0"
19 | },
20 | "devDependencies": {
21 | "autoprefixer": "^6.7.2",
22 | "babel-core": "^6.22.1",
23 | "babel-loader": "^6.2.10",
24 | "babel-plugin-transform-runtime": "^6.22.0",
25 | "babel-preset-latest": "^6.22.0",
26 | "babel-preset-stage-2": "^6.22.0",
27 | "babel-register": "^6.22.0",
28 | "chalk": "^1.1.3",
29 | "connect-history-api-fallback": "^1.3.0",
30 | "copy-webpack-plugin": "^4.0.1",
31 | "css-loader": "^0.26.1",
32 | "eventsource-polyfill": "^0.9.6",
33 | "express": "^4.14.1",
34 | "extract-text-webpack-plugin": "^2.0.0",
35 | "file-loader": "^0.10.0",
36 | "friendly-errors-webpack-plugin": "^1.1.3",
37 | "function-bind": "^1.1.0",
38 | "html-webpack-plugin": "^2.28.0",
39 | "http-proxy-middleware": "^0.17.3",
40 | "webpack-bundle-analyzer": "^2.2.1",
41 | "cross-env": "^3.1.4",
42 | "karma": "^1.4.1",
43 | "karma-coverage": "^1.1.1",
44 | "karma-mocha": "^1.3.0",
45 | "karma-phantomjs-launcher": "^1.0.2",
46 | "karma-sinon-chai": "^1.2.4",
47 | "karma-sourcemap-loader": "^0.3.7",
48 | "karma-spec-reporter": "0.0.26",
49 | "karma-webpack": "^2.0.2",
50 | "lolex": "^1.5.2",
51 | "mocha": "^3.2.0",
52 | "chai": "^3.5.0",
53 | "sinon": "^1.17.7",
54 | "sinon-chai": "^2.8.0",
55 | "inject-loader": "^2.0.1",
56 | "babel-plugin-istanbul": "^3.1.2",
57 | "phantomjs-prebuilt": "^2.1.14",
58 | "chromedriver": "^2.27.2",
59 | "cross-spawn": "^5.0.1",
60 | "nightwatch": "^0.9.12",
61 | "selenium-server": "^3.0.1",
62 | "semver": "^5.3.0",
63 | "opn": "^4.0.2",
64 | "optimize-css-assets-webpack-plugin": "^1.3.0",
65 | "ora": "^1.1.0",
66 | "rimraf": "^2.6.0",
67 | "url-loader": "^0.5.7",
68 | "vue-loader": "^11.0.0",
69 | "vue-style-loader": "^2.0.0",
70 | "vue-template-compiler": "^2.2.1",
71 | "webpack": "^2.2.1",
72 | "webpack-dev-middleware": "^1.10.0",
73 | "webpack-hot-middleware": "^2.16.1",
74 | "webpack-merge": "^2.6.1"
75 | },
76 | "engines": {
77 | "node": ">= 4.0.0",
78 | "npm": ">= 3.0.0"
79 | },
80 | "browserlist": [
81 | "> 1%",
82 | "last 2 versions",
83 | "not ie <= 8"
84 | ]
85 | }
86 |
--------------------------------------------------------------------------------
/readme.txt:
--------------------------------------------------------------------------------
1 | 执行:
2 | 1. npm install /cnpm install
3 | 2. npm run dev
4 |
--------------------------------------------------------------------------------
/src/assets/image/54205424_big.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/src/assets/image/54205424_big.jpg
--------------------------------------------------------------------------------
/src/assets/image/noimg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/src/assets/image/noimg.png
--------------------------------------------------------------------------------
/src/components/DetailHeader.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
7 |
8 |
9 |
10 |
19 |
20 |
53 |
--------------------------------------------------------------------------------
/src/components/Message.vue:
--------------------------------------------------------------------------------
1 |
2 | 我是详情页0419
3 |
4 |
5 |
9 |
10 |
12 |
--------------------------------------------------------------------------------
/src/components/commonFooter.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
11 |
12 |
16 |
17 |
47 |
--------------------------------------------------------------------------------
/src/components/homeHeader.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
6 |
7 |
8 |
9 |
13 |
14 |
35 |
--------------------------------------------------------------------------------
/src/components/list.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
![]()
6 |
7 |
8 |
{{ title }}555555
9 |
{{ price|dTofixed|dCurrency }}
10 |
11 |
12 |
13 |
14 |
15 |
20 |
21 |
78 |
--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 |
3 | import VueResource from 'vue-resource'
4 | Vue.use(VueResource)
5 |
6 | import router from './router/index'
7 |
8 | new Vue({
9 | el: '#app',
10 | data () {
11 | return {
12 | }
13 | },
14 | router
15 | })
16 |
17 | Vue.filter('dCurrency', function(value) {
18 | return '¥'+value
19 | })
20 | Vue.filter('dTofixed', function(value) {
21 | var isNum = parseFloat(value);
22 | if( !isNum ){
23 | alert("请输入数字")
24 | return "请输入数字";
25 | } else {
26 | var value = Math.round(isNum*100)/100;
27 | var item = value.toString().split(".");
28 | if(item.length == 1){
29 | value = value.toString()+".00";
30 | return value;
31 | }
32 | if(item.length > 1){
33 | if(item[1].length < 2){
34 | value = value.toString()+"0";
35 | }
36 | return value;
37 | }
38 | }
39 | })
40 |
--------------------------------------------------------------------------------
/src/pages/goodsDetail.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |

5 |
树懒果园 泰国进口大金煌芒果
6 |
7 | 5斤装,约2-4个果,大!!!甜!!!
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
32 |
33 |
61 |
--------------------------------------------------------------------------------
/src/pages/home.vue:
--------------------------------------------------------------------------------
1 |
2 |
11 |
12 |
13 |
35 |
36 |
56 |
--------------------------------------------------------------------------------
/src/router/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import VueRouter from 'vue-router'
3 | /*
4 | import Home from '../pages/home'
5 | */
6 | import Detail from '../pages/goodsDetail'
7 | import Msg from '../components/Message.vue'
8 |
9 |
10 | Vue.use(VueRouter)
11 | const routes = [
12 | {
13 | path: '/',
14 | component: resolve => require(['../pages/home'],resolve),
15 | meta: {
16 | title:'home'
17 | }
18 | },
19 | {
20 | path: '/msg',
21 | component: Msg
22 | },
23 | {
24 | path: '/detail',
25 | component: Detail,
26 | children: [
27 | {
28 | path:'msg',
29 | component: Msg
30 | }
31 | ]
32 | }
33 | ]
34 | export default new VueRouter({
35 | routes
36 | })
37 |
--------------------------------------------------------------------------------
/static/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datura-lj/vue_cli_demo/d2af608c243e9ef91453cbcfda13220e69db14e0/static/.gitkeep
--------------------------------------------------------------------------------
/test/e2e/custom-assertions/elementCount.js:
--------------------------------------------------------------------------------
1 | // A custom Nightwatch assertion.
2 | // the name of the method is the filename.
3 | // can be used in tests like this:
4 | //
5 | // browser.assert.elementCount(selector, count)
6 | //
7 | // for how to write custom assertions see
8 | // http://nightwatchjs.org/guide#writing-custom-assertions
9 | exports.assertion = function (selector, count) {
10 | this.message = 'Testing if element <' + selector + '> has count: ' + count
11 | this.expected = count
12 | this.pass = function (val) {
13 | return val === this.expected
14 | }
15 | this.value = function (res) {
16 | return res.value
17 | }
18 | this.command = function (cb) {
19 | var self = this
20 | return this.api.execute(function (selector) {
21 | return document.querySelectorAll(selector).length
22 | }, [selector], function (res) {
23 | cb.call(self, res)
24 | })
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/test/e2e/nightwatch.conf.js:
--------------------------------------------------------------------------------
1 | require('babel-register')
2 | var config = require('../../config')
3 |
4 | // http://nightwatchjs.org/guide#settings-file
5 | module.exports = {
6 | src_folders: ['test/e2e/specs'],
7 | output_folder: 'test/e2e/reports',
8 | custom_assertions_path: ['test/e2e/custom-assertions'],
9 |
10 | selenium: {
11 | start_process: true,
12 | server_path: require('selenium-server').path,
13 | host: '127.0.0.1',
14 | port: 4444,
15 | cli_args: {
16 | 'webdriver.chrome.driver': require('chromedriver').path
17 | }
18 | },
19 |
20 | test_settings: {
21 | default: {
22 | selenium_port: 4444,
23 | selenium_host: 'localhost',
24 | silent: true,
25 | globals: {
26 | devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
27 | }
28 | },
29 |
30 | chrome: {
31 | desiredCapabilities: {
32 | browserName: 'chrome',
33 | javascriptEnabled: true,
34 | acceptSslCerts: true
35 | }
36 | },
37 |
38 | firefox: {
39 | desiredCapabilities: {
40 | browserName: 'firefox',
41 | javascriptEnabled: true,
42 | acceptSslCerts: true
43 | }
44 | }
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/test/e2e/runner.js:
--------------------------------------------------------------------------------
1 | // 1. start the dev server using production config
2 | process.env.NODE_ENV = 'testing'
3 | var server = require('../../build/dev-server.js')
4 |
5 | // 2. run the nightwatch test suite against it
6 | // to run in additional browsers:
7 | // 1. add an entry in test/e2e/nightwatch.conf.json under "test_settings"
8 | // 2. add it to the --env flag below
9 | // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
10 | // For more information on Nightwatch's config file, see
11 | // http://nightwatchjs.org/guide#settings-file
12 | var opts = process.argv.slice(2)
13 | if (opts.indexOf('--config') === -1) {
14 | opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
15 | }
16 | if (opts.indexOf('--env') === -1) {
17 | opts = opts.concat(['--env', 'chrome'])
18 | }
19 |
20 | var spawn = require('cross-spawn')
21 | var runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' })
22 |
23 | runner.on('exit', function (code) {
24 | server.close()
25 | process.exit(code)
26 | })
27 |
28 | runner.on('error', function (err) {
29 | server.close()
30 | throw err
31 | })
32 |
--------------------------------------------------------------------------------
/test/e2e/specs/test.js:
--------------------------------------------------------------------------------
1 | // For authoring Nightwatch tests, see
2 | // http://nightwatchjs.org/guide#usage
3 |
4 | module.exports = {
5 | 'default e2e tests': function (browser) {
6 | // automatically uses dev Server port from /config.index.js
7 | // default: http://localhost:8080
8 | // see nightwatch.conf.js
9 | const devServer = browser.globals.devServerURL
10 |
11 | browser
12 | .url(devServer)
13 | .waitForElementVisible('#app', 5000)
14 | .assert.elementPresent('.hello')
15 | .assert.containsText('h1', 'Welcome to Your Vue.js App')
16 | .assert.elementCount('img', 1)
17 | .end()
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/test/unit/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "mocha": true
4 | },
5 | "globals": {
6 | "expect": true,
7 | "sinon": true
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/test/unit/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | Vue.config.productionTip = false
3 |
4 | // Polyfill fn.bind() for PhantomJS
5 | /* eslint-disable no-extend-native */
6 | Function.prototype.bind = require('function-bind')
7 |
8 | // require all test files (files that ends with .spec.js)
9 | const testsContext = require.context('./specs', true, /\.spec$/)
10 | testsContext.keys().forEach(testsContext)
11 |
12 | // require all src files except main.js for coverage.
13 | // you can also change this to match only the subset of files that
14 | // you want coverage for.
15 | const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/)
16 | srcContext.keys().forEach(srcContext)
17 |
--------------------------------------------------------------------------------
/test/unit/karma.conf.js:
--------------------------------------------------------------------------------
1 | // This is a karma config file. For more details see
2 | // http://karma-runner.github.io/0.13/config/configuration-file.html
3 | // we are also using it with karma-webpack
4 | // https://github.com/webpack/karma-webpack
5 |
6 | var webpackConfig = require('../../build/webpack.test.conf')
7 |
8 | module.exports = function (config) {
9 | config.set({
10 | // to run in additional browsers:
11 | // 1. install corresponding karma launcher
12 | // http://karma-runner.github.io/0.13/config/browsers.html
13 | // 2. add it to the `browsers` array below.
14 | browsers: ['PhantomJS'],
15 | frameworks: ['mocha', 'sinon-chai'],
16 | reporters: ['spec', 'coverage'],
17 | files: ['./index.js'],
18 | preprocessors: {
19 | './index.js': ['webpack', 'sourcemap']
20 | },
21 | webpack: webpackConfig,
22 | webpackMiddleware: {
23 | noInfo: true
24 | },
25 | coverageReporter: {
26 | dir: './coverage',
27 | reporters: [
28 | { type: 'lcov', subdir: '.' },
29 | { type: 'text-summary' }
30 | ]
31 | }
32 | })
33 | }
34 |
--------------------------------------------------------------------------------
/test/unit/specs/Hello.spec.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import Hello from '@/components/Hello'
3 |
4 | describe('Hello.vue', () => {
5 | it('should render correct contents', () => {
6 | const Constructor = Vue.extend(Hello)
7 | const vm = new Constructor().$mount()
8 | expect(vm.$el.querySelector('.hello h1').textContent)
9 | .to.equal('Welcome to Your Vue.js App')
10 | })
11 | })
12 |
--------------------------------------------------------------------------------