【VTK】vtk例子-webpack问题

1、下载vtkjs-examples-master

https://github.com/KitwareMedical/vtk.js-examples

2、package.json配置修改

{
  "name": "vtkjs-example",
  "version": "1.0.0",
  "description": "",
  "main": "src/index.js",
  "scripts": {
    "build-webpack": "webpack --progress --colors --mode development",
    "start": "webpack-dev-server --port 33333 --content-base ./dist",
    

    "build": "webpack-dev-server --mode=production --progress  --port 33333",

    "dev": "webpack-dev-server --mode=development  --port 33333",
    
    "dev:cone": "set EXAMPLE=cone.js & webpack-dev-server --mode=development  --port 33333",
    "dev:cone-filter": "set EXAMPLE=cone-filter.js & webpack-dev-server --mode=development  --port 33333",
    "dev:volume": "set EXAMPLE=volume.js & webpack-dev-server --mode=development  --port 33333 --",
    "dev:volume-transfer": "set EXAMPLE=volume-transfer.js & webpack-dev-server --mode=development  --port 33333",
    "dev:image-slicing": "set EXAMPLE=image-slicing.js & webpack-dev-server --mode=development  --port 33333",
    "dev:widgets": "set EXAMPLE=widgets.js & webpack-dev-server --mode=development  --port 33333"
  },
  "author": "",
  "license": "BSD-3-Clause",
  "dependencies": {
    "vtk.js": "^13.10.0"
  },
  "devDependencies": {
    "kw-web-suite": "^9.0.0",
    "webpack": "^4.41.6"
  }
}

3、webpack.config.js配置修改

const path = require('path');

// console.log(path)

const vtkRules = require('vtk.js/Utilities/config/dependency.js').webpack.core.rules;

console.log(process.env['EXAMPLE'])
// const example = process.env['EXAMPLE'].replace(/[\/]|\.\./g, '') || 'cone.js';
// const example = process.env['EXAMPLE'] && process.env['EXAMPLE'].replace('') //|| 'cone.js';
const example = process.env['EXAMPLE'] || 'cone.js';
console.log(example)
// example = "volume"

var entry = path.join(__dirname, 'src', example)
console.log(entry)
var entry2 = './src/'+ example
entry2 = entry2.trim()
console.log(entry2)

module.exports = {
  entry: entry.trim(),
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'app.js',
  },
  module: {
    rules: [{
      test: /\.js$/,
      loader: 'babel-loader',
      exclude: /node_modules/,
    }, ].concat(vtkRules),
  },
  resolve: {
    extensions: ['.js'],
  },
  devServer: {
    contentBase: path.join(__dirname, 'dist'),
    disableHostCheck: true,
    hot: false,
    quiet: false,
    noInfo: false,
    stats: {
      colors: true,
    },
  },
};

// console.log(module.exports)

4、运行测试

npm run dev

npm run dev:cone

来源：https://www.cnblogs.com/defineconst/p/12378547.html

标签

Webpack

dev